обнаружение, если текущий рабочий браузер - сафари через css или javascript

Question

Я выяснил, является ли браузер Safari или нет. В javascript: window.devicePixelRatio объект дает «1» как для Chrome, так и для Safari. В CSS:

@media screen and (-webkit-min-device-pixel-ratio:0){
    #yourdiv{
        margin-left:0;

    }
} 

Работает как для Chrome, так и для Safari. Но я не нашел взломать css или javascript только для браузера Safari (не должен работать для любого другого браузера). Может ли любое тело помочь мне.

Я использую браузер Safari: navigator.useragent = Mozilla/5.0 (Windows; U; Windows NT 5.2; en-US) AppleWebKit/533.16 (KHTML, like Gecko) Version/5.0 Safari/533.16

Answer 1

if (navigator.userAgent.match(/AppleWebKit/) && ! navigator.userAgent.match(/Chrome/)) {
   alert('this is safari brower and only safari brower')
}

Answer 2

CSS-хаки не одобряются, хотя и менее осуждаются при нацеливании на более старые версии IE (неизбежное зло).

Вы можете понять, если использовать Safari, как это ...

JavaScript

if (navigator.userAgent.match(/OS X.*Safari/) && ! navigator.userAgent.match(/Chrome/)) {
   document.body.className += 'safari';
}

... и затем используйте изменение ваших селекторов для Safari, например ...

CSS

.safari #yourdiv {
    margin-left: 0;
}

jsFiddle .

Answer 3

Есть функция javascript, которая помогает идентифицировать большинство браузеров здесь .

Его стоит держать в курсе, так как он регулярно обновляется.

В порядке пояснения со связанной страницы скопировано следующее:

---

Обнаружение браузера

Массив dataBrowser заполнен объектами, которые содержат свойства, помогающие сценарию обнаружить браузер вашего пользователя. Обратите внимание на его общий синтаксис:

dataBrowser: [
    {
        prop: window.opera,
        identity: "Opera",
        versionSearch: "Version" // note: no comma
    },
    {
        string: navigator.userAgent,
        subString: "MSIE",
        identity: "Explorer",
        versionSearch: "MSIE" // note: no comma
    } // note: no comma
];

[] определяет литерал массива, и все его элементы являются литералами объекта. Каждый литерал объекта заключен в фигурные скобки {} и содержит несколько свойств (name: value,). Обратите внимание, что запятая между объектами и между свойствами обязательна, но последняя запятая всегда запрещена.

Свойства

Каждый объект в массиве dataBrowser может содержать следующие свойства:

свойства строки и подстроки. Они говорят: «поиск подстроки в строке». Если подстрока найдена, браузер идентифицирован. свойство собственности. Он говорит: «Посмотрите, поддерживается ли опора». Если это так, браузер идентифицирован. Строка идентификатора. Эта строка становится значением BrowserDetect.browser. Строка поиска версии. Это для поиска номера версии (см. Ниже). Если это свойство отсутствует, вместо него используется строка идентификатора. Каждый объект должен содержать 1 или 2 (никогда оба!), Должен содержать 3 и может содержать 4.

Answer 4

Я знаю, что этот вопрос немного устарел, но все предоставленные ответы обнаружат как настольный, так и мобильный Safari.Чтобы обнаружить только одно или другое, вы можете использовать это:

var inDesktopSafari = (navigator.userAgent.toLowerCase().indexOf('safari') !== -1 && navigator.userAgent.toLowerCase().indexOf('chrome') === -1) && typeof window.ontouchstart === 'undefined';

var inMobileSafari = (navigator.userAgent.toLowerCase().indexOf('safari') !== -1 && navigator.userAgent.toLowerCase().indexOf('chrome') === -1) && typeof window.ontouchstart !== 'undefined';