изменяющего Стили Upon Ширина устройства

Question

метатегов

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 

Вышесказанное означает мобильный телефон или любое другое устройство, не будет масштабироваться мой сайт автоматически и поэтому будет видеть мою страницу, как я собираюсь их сделать это.

---

CSS Styling

/** Default Global CSS Styles are here. **/ 

@media screen and (max-width: 979px) { 
    /** At this point, my top navigation is too big **/ 
    /** for the device width, therefore we switch **/ 
    /** to the mobile version of the navigation. **/ 
} 
@media screen and (min-width: 650px) and (max-width: 979px) { 
    /** As the width gets smaller the content gets **/ 
    /** smaller so this is to resize even more.  **/ 
} 
@media screen and (max-width: 649px) { 
    /** This is the final, smallest width option **/ 
    /** I currently have in place.     **/ 
} 

@media screen and (min-width: 980px) { 
    /** This is the main, non-mobile website view **/ 
} 

---

JQuery

$(window).resize(function() { 
    var PageWidth = $('body').innerWidth(); 
    if (PageWidth > 979) { 
     $('#TopNavList').show(); 
    } else { 
     $('#TopNavList').hide(); 
    } 
    $('#TopNavList').children("li").removeClass("active"); 
}); 

из-за наличия слайд Jquery и исчезать функции на моей странице, это реализовать встроенный CSS на моей странице после активации. Все, кажется, работает, как он должен, кроме когда вы повторить эти шаги:

1. Откройте мое webpage
2. Изменения вашей ширины медленно делая его меньше
3. Между два меню, ничего не видно.

Я боролся с этим всю неделю, я лично считаю, что это связано с некоторыми браузерами медиазапросы ширина чтения внутреннюю ширину (без скроллинга), а некоторые только по всей ширине (с скроллинга), однако я гаванью» У меня есть ключ к решению.

Answer 1

Благодаря @Jorg с его комментарием, оставленным на мой вопрос, началось новое начало, которое привело меня к mqGenie.

mqGenie настраивает CSS-запросы в браузерах, которые включают ширину полосы прокрутки в ширине окна просмотра, поэтому они запускаются с заданным размером, поэтому я загрузил сценарий и просто привязал к скрипту на своей странице, и все сработало так, как должно.

Я очень рекомендую всем, кто имеет дело с той же проблемой, чтобы загрузить mqGenie, который распространяется по лицензии MIT (см LICENSE для деталей) и версии уменьшенной создан с UglifyJS