Opera 12 CSS hack

Вышла «Опера» 12, многое поменялось, на некоторых моих сайтах едут стили. В частности, на «Маке» «Опера» поменяла поведение стиля «font-size: 0» — теперь он отображается шрифтом какого-то минимального размера.

Пришлось придумывать ЦСС-хак для этой версии. Я не могу себе позволить искать новое решение и заново тестировать его во всех браузерах, мне проще оставить всё как есть, сделав исключение.

Хак получился вот такой:

@media (min-resolution: .001dpcm) {
    _:-o-prefocus, body { /* стиль только для Opera 12.00+ */
        background: red;
    };
}

Соответственно, на место «body» надо поставить требуемый тег или селектор.

36 комментариев

Как определить модель iPad через JavaScript?

На «Хабре» наткнулся на любопытный код на JS, который определяет с каким Айпадом мы имеем дело — первым, вторым или третьим. Третий ото всех остальных отличить просто — у него в свойстве «devicePixelRatio» значение „2“ записано. А первый от второго как?

Оказывается способ есть — надо в событии «devicemotion» проверить есть ли у устройства акселерометр. Не знаю для чего это всё может пригодиться (разве что отключать какие-то ресурсоёмкие спецэффекты), но знать о том, что такая возможность проверки есть, не помешает.

Я немного переписал код, сделал из него функцию, чуть упростил и навёл порядок. Получился вот такой код:

// функция для определения модели Айпада
function detectIPadVersion(callback, undefined) {
    if ('ondevicemotion' in window) {
        window.addEventListener('devicemotion', function self(event) {
            if (~navigator.platform.indexOf('iPad')) {
                var version = event.acceleration ? (window.devicePixelRatio === 2) + 2 : 1;
            }
            window.removeEventListener('devicemotion', self);

            callback(version);
        }, false);
    } else {
        callback(undefined);
    }
};

// пример вызова, в callback будет передан номер модели (1,2 или 3) или undefined, в случае, если это не iPad
detectIPadVersion(alert);

26 комментариев