Сделать логотип в меню, как на пикабу. 2.X

 
Посетитель
small user social cms
МедальПочетный донор проекта
Сообщений: 540
Всем привет)))
Вот задался таким вопросом.
Есть ли у кого подобный вывод логотипа?

Код PHP:
  1. #logo { position: fixed;
  2. height: 60px;
  3. overflow: hidden;
  4. width: 166px;
  5. z-index: 990;
  6. }
Так то вроде получается, но если зайдем с мобильного телефона, то логотип налазиет на меню, когда скролим, потому как меню тоже фиксируется.
Посетитель
small user social cms
Медаль
Сообщений: 653
Мне там кошара на логотипе понравилась (не знаю есть ли сейчас). При наведении она пряталась laugh Если кто скинет это решение буду рад
Реклама
cms
Посетитель
small user social cms
МедальАвторитет форумаПочетный донор проектаКубок зрительских симпатий
Сообщений: 3016
У меня был, делал на основе boxed, завтра могу найти исходники. Демо могу в лычку скинуть (там принципе тоже не сложно выдрать)

P. S. Надо сделать шаблон пикабу для инстанта)
Посетитель
small user social cms
МедальПочетный донор проекта
Сообщений: 540
Jestik, буду признателен за ссылочку)))
Так у вас все хорошо отображается на смартфоне?
Мне вот немного не понятно, как правильно в @media screen добавить логотип?
То есть определить совсем другую картинку?
Если основное фото, допустим 60 на 200 пикселей, то на смартфонах показывать, ну допустим 60 на 60 ?
Посетитель
small user social cms
МедальАвторитет форумаПочетный донор проекта
Сообщений: 1320
skewes:
Мне вот немного не понятно, как правильно в @media screen добавить логотип?
Двумя способами или через бэкграунд или прятать элемент

Код PHP:
  1.  
  2. <style>
  3. /* hide mobile version by default */
  4. .logo .mobile {
  5. display: none;
  6. }
  7. /* when screen is less than 600px wide
  8.   show mobile version and hide desktop */
  9. @media (max-width: 600px) {
  10. .logo .mobile {
  11. display: block;
  12. }
  13. .logo .desktop {
  14. display: none;
  15. }
  16. }
  17. </style>
  18.  
  19. <div class="logo">
  20. <img src="/images/logo_desktop.png" class="desktop" />
  21. <img src="/images/logo_mobile.png" class="mobile />
  22. </div>
  23.  

Jestik:
P. S. Надо сделать шаблон пикабу для инстанта)

А что там сложно такого что не реализовать на инстанте?
Редактировалось: 1 раз (Последний: 7 декабря 2018 в 07:33)
Фриланс по Intantcms 1 и 2 версий.Писать в ЛС. Отзывы заказчиков
В начало страницы
Предыдущая темаПерейти на форум:
Быстрый ответ
Чтобы писать на форуме, зарегистрируйтесь или авторизуйтесь.