Специфичное для браузера поведение и уровень запуска в JavaScript

#javascript #jquery #css #browser #modal-dialog

#javascript #jquery #css #браузер #модальный диалог

Вопрос:

Пожалуйста, ребята, мне нужна помощь в этом проекте: я немного смущен, я хотел, чтобы этот фрагмент кода отображал определенный стиль div modal, предназначенный для конкретного браузера. Чего я хочу: если браузер firefox модальный, отображается «По дороге домой» в стиле class .home. в противном случае, если мой браузер chrome, отобразите модальный «Home Now»

Спасибо

$(функция (){

 function modal() {

    var options = {
        trigger: '.lp-download-btn',
        selectorClose: '.close',
        selectorContent: '#j-download-instructions',
        selectorLinks: 'a',
        chromes: '.chrome'
    };

    var $body = $(options.selectorContent);
    var $chromeBrowser = $(options.chromes);

    
    $('body').on('click', options.trigger, function() {
        $body.css({
            height: '100%',
            width: '100%',
            visibility: 'visible'
        });
    })

    $body.on('click', function(e){
        if (this == e.target) {
            $body.hide();
            return false;
        }
    });

    $body.on('click', options.selectorClose, function(){
        $body.hide();
        return false;
    });

    $body.on('click', function() {
        $chromeBrowser.css({
            display: 'block'
        })
    })

}
function browserDetection() {
    // IE or not
    if (navigator.userAgent.search("MSIE") >=0 ){
        return modal();
    }
    

    // Chrome browser 
    else if (navigator.userAgent.search("Chrome") >= 0) {
        return modal();
    }

    // Firefox Browser 
    else if (navigator.userAgent.search("Firefox") >= 0) {}

    // Safari browser 
    else if (navigator.userAgent.search("Safari") >= 0 amp;amp; navigator.userAgent.search("Chrome") < 0) {}

    // Opera browser 

    else if (navigator.userAgent.search("Opera") >= 0) {}
}


browserDetection();
  

});

Ответ №1:

Вы можете выполнить перехват пользовательского агента, чтобы, возможно, определить, в каком браузере кто-то находится, хотя у него есть недостатки https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/User-Agent но в этом случае вы можете использовать это, чтобы делать то, что вам хотелось бы.