Привет.
Пытаюсь воплотить идею наличия статичной шапки при прокрутке страницы вниз.
т.е. если скролл ниже 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>
Фиксированная шапка при прокрутке страницы (принцип Яндекса)
(Ответов: 2, Просмотров: 6790)
- 17.05.2013 19:12
- Регистрация: 17.05.2013
- Сообщений: 2
- Репутация: 0
- 17.05.2013 19:57
Levin, подключите для начала библиотеку jquery, так как вы используете ее методы
Спасибо сказали:
Levin(18.05.2013), - 18.05.2013 16:22
- Регистрация: 17.05.2013
- Сообщений: 2
- Репутация: 0
bizpapa, а слона то я и не заметил!!!
Спасибо!!!
Похожие темы
Темы | Раздел | Ответов | Последний пост |
---|---|---|---|
Ищу скрипт прилепляющий элементы при прокрутке | Web программирование | 4 | 07.12.2012 22:24 |
Принцип работы "Статистика страницы" в Google analytics | 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 |