Фиксированная шапка при прокрутке страницы (принцип Яндекса)

(Ответов: 2, Просмотров: 6790)
  1. Новичок
    • Регистрация: 17.05.2013
    • Сообщений: 2
    • Репутация: 0
    Привет.
    Пытаюсь воплотить идею наличия статичной шапки при прокрутке страницы вниз.
    т.е. если скролл ниже 100рх, то нужно отобразить слой, если выше убрать. Идея интересная, может быть кому пригодится.
    Я не очень силен в javascript`ах, поэтому думаю что у меня ошибка имеется, которую я сам не могу найти.
    Упростил код до минимума:
    <style type="text/css">
    #header_bar{
    display:none;
    position:fixed;
    width:100%;
    min-width:1000px;
    height:50px;
    z-index:900;
    }
    #header_bar.opened{
    display:block;
    }
    </style>
    </head>

    <body>

    <script type="text/javascript">
    $(document).ready(function(){
    var panel=($(window).scrollTop()>100)?$('#header_bar') .addClass('opened'):$('#header_bar');
    $(window).scroll(function(){
    if($(this).scrollTop() > 100 && !panel.hasClass('opened')){
    panel.addClass('opened');
    }else if($(this).scrollTop() < 100 && panel.hasClass('opened')){
    panel.removeClass('opened');
    }});
    });
    </script>
    <div id="header_bar" class="header_bar"><div class="bar_in">
    <div class="panel">привет. Я классная верхняя панель. Я появляюсь когда скрол опускается ниже 100рх. </div>
    <div class="shdw"></div>
    </div></div>
    Сохраняем файл, а скрипт не выполняется!!!
    • 0
  2. Студент Аватар для bizpapa
    • Регистрация: 07.06.2011
    • Сообщений: 93
    • Репутация: 25
    • Webmoney BL: ?
    Levin, подключите для начала библиотеку jquery, так как вы используете ее методы
    • 1

    Спасибо сказали:

    Levin(18.05.2013),
  3. Новичок
    • Регистрация: 17.05.2013
    • Сообщений: 2
    • Репутация: 0
    bizpapa, а слона то я и не заметил!!!
    Спасибо!!!
    • 0

Похожие темы

Темы Раздел Ответов Последний пост
Ищу скрипт прилепляющий элементы при прокрутке
Web программирование 4 07.12.2012 22:24
Принцип работы "Статистика страницы" в Google analytics
Google 2 06.07.2012 01:08
Принцип работы "Статистика страницы" в Google analytics
Вопросы от новичков 1 05.07.2012 11:11
Выпадают страницы из Яндекса.
Поисковые системы 13 17.12.2011 23:02
Текст в прокрутке.
Вопросы от новичков 6 16.08.2011 23:48

У кого попросить инвайт?

Вы можете попросить инвайт у любого модератора:

Информеры