Как сделать «неисчезающе-фиксированное» меню

👍 Научим создавать сайты на WordPress бесплатно за 19 уроков. Подробнее →

Друзья, я даже не знаю как правильно написать это в заголовке, поэтому назвал это «неисчезающе-фиксированное» меню.
В общем нужна либо тема, либо рецепт как сделать верхнее меню, как вот на этих сайтах: www.lookatme.ru или http://knitly.com/
То есть когда навигационная панель сверху и никуда не исчезает. Подскажите пожалуйста. Простите за неграмотность в описании задачи. Я новичок. :)

Создай свой первый сайт на WordPress

Max
Оцените автора
Добавить комментарий

  1. tiaurus

    Приятно, что за образец взят мой проект http://knitly.com/ :) .
    Сделать неизчезающее меню (или любой другой неисчезающий с экрана объект) поможет изучение CSS, а если точнее, то двух параметров: z-index и position.
    z-index:
    http://webcache.googleusercontent.com/search?q=cache:tu3N-sh86IUJ:htmlbook.ru/css/z-index+z-index&cd=1&hl=ru&ct=clnk&gl=ua&client=firefox
    http://www.webcreator.kiev.ua/lib/%D0%A1ss-%D0%BF%D1%80%D0%B8%D0%BA%D0%BE%D0%BB%D1%8B/css-c%D0%B2%D0%BE%D0%B9%D1%81%D1%82%D0%B2%D0%BE-z-index-%D0%BF%D0%BE%D0%B4%D1%80%D0%BE%D0%B1%D0%BD%D1%8B%D0%B9-%D0%BE%D0%B1%D0%B7%D0%BE%D1%80/
    http://www.w3schools.com/Css/pr_pos_z-index.asp
    position:
    http://webcache.googleusercontent.com/search?q=cache:k17v4POj2hwJ:htmlbook.ru/css/position+css+absolute&cd=1&hl=ru&ct=clnk&gl=ua&client=firefox
    http://www.w3schools.com/css/pr_class_position.asp

    Пример:
    В шаблон вставить

    <div id="sup">тут находится любое содержимое, которое нужно вывести поверх всех остальных и зафиксировать</div>

    В style.css добавить

    #sup {position:fixed; top:0; left:0; z-index:100; width:100%; height:55px; }
    

    Этот элемент будет отображаться вверху страницы поверх всех остальных, на всю ширину и высоту в 55px. Внутри элемента можно расположить что угодно: картинку, вызов меню. Думаю, идея ясна.

    Ответить
    1. Max

      Класс. Спасибо! Буду пробовать!

      Ответить
    2. Beetroot

      Скажите, а как сделать чтобы статичная панель навигации появлялась спустя время, когда скроллишь вниз?

      Ответить
      1. tiaurus

        Без дополнительных java-скриптов не обойтись. Например, можно сделать так.

        Ответить