Верстка основного меню в мобильной версии

[anboza]

Только что, AWARO сказал:

подсмотри примеры,

подскажите хоть один, я найти не могу, чтобы переносились корзина, переключатель языков и поиск.
везде переносится только меню категорий, доп пункты и т.д. но они в 99% делаются через hidden - visible, а тут как ((

[HyperLabTeam]

https://ruseller.com/lessons.php?id=673

как пример

jQ

если размер такой то это туда

[Blast]

27 минут назад, anboza сказал:

вариант не подходит - элeменты с атрибутом id

тем более, что логотип остается на своем месте...

так никто ж не заставляет дублировать с таким же id

<div id="mobile-logo" class="visible-xs"></div>
<div id="header">
  <nav id="top"></nav>
  <header>
    <div id="logo" class="hidden-xs"></div>
  </header>
  <div class="container"></div>
</div>

и для #header те стили, что я писал выше по медиа-запросу @media (max-width: 768px) {...}

если смущает двойная загрузка логотипа, то можно загрузить лого для мобильной версии js в $(window).resize() когда ширина будет менее 768px

[anboza]

Только что, AWARO сказал:

https://ruseller.com/lessons.php?id=673

 

jQ

с этого начали. другие варианты может есть?...

[anboza]

Только что, Blast сказал:

так никто ж не заставляет дублировать с таким же id

<div id="mobile-logo" class="visible-xs"></div>
<div id="header">
  <nav id="top"></nav>
  <header>
    <div id="logo" class="hidden-xs"></div>
  </header>
  <div class="container"></div>
</div>

и для #header те стили, что я писал выше по медиа-запросу @media (max-width: 768px) {...}

если смущает двойная загрузка логотипа, то можно загрузить лого для мобильной версии js в $(window).resize() когда ширина будет менее 768px

тогда придется дописывать common.js

по трудозатратам, так себе вариантец, хотя, конечно, рабочий ))

 

тогда уже проще is mobile и просто грузить другой хэдэр...

Змінено 13 січня 2020 користувачем anboza

[HyperLabTeam]

4 минуты назад, anboza сказал:

с этого начали. другие варианты может есть?...

а чего не так с этим?

 

[anboza]

Только что, AWARO сказал:

а чего не так с этим?

та уже ж 2 раза писал - не хочется тормозить скриптом в самом начале страницы, как-то не кошерно вроде...или я придираюсь уже?

[HyperLabTeam]

4 минуты назад, anboza сказал:

та уже ж 2 раза писал - не хочется тормозить скриптом в самом начале страницы, как-то не кошерно вроде...или я придираюсь уже?

так то да а так то нет ))

[anboza]

Только что, AWARO сказал:

так то да а так то нет ))

[HyperLabTeam]

а дублировать , корзину, поиск и подобное это не оч затея, если ток переносить - ну или отдельно под моб - отдельно под десктоп и отдавать через мобайл детект нужное

[anboza]

Только что, AWARO сказал:

а дублировать , корзину, поиск и пождобное это не оч затея, если ток переносить ну или отдельно под моб отдельно под десктоп и отдавать через мобайл детект нужное

да, я к тем же выводам пришел, в результате дискуссии...

[Blast]

14 минут назад, AWARO сказал:

а дублировать , корзину, поиск и подобное это не оч затея, если ток переносить - ну или отдельно под моб - отдельно под десктоп и отдавать через мобайл детект нужное

в данном примере только лого вроде нужно продублировать. С переносом кстати тоже при правильной верстке

а больше вариантов кроме mobile detect наверное и нет

Змінено 13 січня 2020 користувачем Blast