Как удалить div при определенном разрешении экрана и вернуть его обратно?
На сайте есть 2 меню: одно для больших экранов и одно для мобильников. То что для мобильников отображается в коде в десктопной версии, хотелось бы этот ненужный для этого разрешения код удалить, а потом вернуть назад, когда он потребуется (при заходе на сайт с мобильника).
И то же самое проделать со вторым меню, когда оно на большом экране оставить, а когда на мобильнике удалить из кода. Не display:none, а именно удалить из кода!
Для чего это нужно? Вы уже загрузили этот код на клиент, а потом хотите его выбросить? display: none; в любом случае не обрабатывается, зачем лишняя возня?
Наверное, я не тот тэг указал, нужно все сделать через php, чтобы еще до клиента не дошло.
Я посмотрел свой другой сайт, он сделан на другом шаблоне, вот демка: impreza.us-themes.com, там одно и тоже меню через какой-то скрипт меняется на мобильное и обратно, вот только откуда вытащить этот скрипт мне не разобрать, слишком я зелен для этого...
Какая разница, JS это или display:none, оно все равно загрузится (пожрет трафик) пользователю.
Отдавать именно разные куски кода (или даже разные шаблоны) - это к бэкэнду.
Хорошо бы подумать почему это меню сделано разными блоками, почему это не один и тот же блок, просто расположенный в разных местах с помощью media запросов?
Да, вы правы, бэкэнд... Вот именно этого мне и нужно добиться, чтобы трафик не кушался.
Ладно, нашел я немного другой выход полегче. Отключу в шаблоне мобильное меню, и оптимизирую стандартное, заменю надписи на иконки и сделаю резиновым - все через css.
При загрузке страницы смотреть на document.body.clientWidth, если надо - грузить блок ajax`ом,
далее в $(window).resize() так же смотреть на document.body.clientWidth и показывать\удалять блок.
Возможно. Гуглится элементарно же. Например, вот здесь все написано исчерпывающе и весьма простым языком.
Стоит иметь в виду, что операции с DOM весьма затратны и не стоит ими злоупотреблять. "display: none" наиболее часто оказывается лучшим решением. Это я так...на будущее.
