Использование Enquire.JS для переключения между скриптами в зависимости от размера экрана
Я сделал страницу, которая имеет два разных сценария. Сценарий, который запускается, определяется размером экрана. Enquire.Js используется для достижения этой цели.
Когда страница просматривается на экране размером более 600 пикселей, я хочу, чтобы содержимое отображалось с помощью вкладок jQuery. Я сделал здесь тестовую модель, и она отлично работает: Live Page || Версия JS Fiddle
Хотя это работает, это работает только в одну сторону. Т.е. при изменении размера окна Enqiurie.js делает свое "волшебство". Но если размер окна снова изменится, "магия" не изменится. (в отличие от медиа-запроса CSS, когда изменение размера окна снова приводит к изменению медиа-запроса).
Когда страница просматривается на экране размером менее 600 пикселей, я хочу, чтобы она отображалась с навигацией в стиле iPhone. Я сделал здесь тестовую модель, и она также отлично работает: Live Page || Версия Fiddle JS Однако, опять же, это работает только в одну сторону.
Когда я пытаюсь объединить две демонстрации (то есть, чтобы переключаться между вкладками и навигацией в стиле iphone, это не совсем работает. См. Тестовую модель здесь: Live Page || JS Fiddle Version)
Если браузер загружает более 600 пикселей, вам нужно обновить окно для отображения вкладок. Если вы снова увеличите размер окна с 600 до 600 пикселей, часть кода с размером менее 600 пикселей, вероятно, сохранится.
Я не уверен, что я делаю неправильно. Спасибо за любую помощь!