Бочонок
http://frontender.info
Помогите найти причину судорожного подергивания блока
Приятного времени суток.
Написал скриптик, который должен двигать двигать блок при скроле страницы так, что бы он все время был на экране, но не налазил на подвал и шапку.
Сразу оговорю что это должно работать во 2 и 3 FF и 7 IE.
И все бы хорошо... но есть два но:
1. клиент говорит что оно в верхней и нижней точках прежде чем остановиться жутко дергается.
2. у меня оно в том же браузере на том де разрешении двигается очень плавно и красиво. Я теряюсь в догадках. Помогите пожалуйста выяснить в чем беда.
http://nightfolk.net/work/template/page-03/index.html
Принцип работы прост.
После загрузки текста страницы на окно навешиваем событие, которое по скролу будет переключать состояния двигающегося блока.
и далее в зависимости от того насколько прокручена страница определяем какое из трех состояний (вверху, внизу или на 10 точек от верха экрана.).
Ну и собственно стили:
Ничего сверхестественного. Что я мог упустить? Почему оно может дергатся???
Очень рассчитываю на вашу помощь - я в отчаянии.
Приятного времени суток.
Написал скриптик, который должен двигать двигать блок при скроле страницы так, что бы он все время был на экране, но не налазил на подвал и шапку.
Сразу оговорю что это должно работать во 2 и 3 FF и 7 IE.
И все бы хорошо... но есть два но:
1. клиент говорит что оно в верхней и нижней точках прежде чем остановиться жутко дергается.
2. у меня оно в том же браузере на том де разрешении двигается очень плавно и красиво. Я теряюсь в догадках. Помогите пожалуйста выяснить в чем беда.
http://nightfolk.net/work/template/page-03/index.html
Принцип работы прост.
После загрузки текста страницы на окно навешиваем событие, которое по скролу будет переключать состояния двигающегося блока.
PHP:
event_controller = new event;
event_controller.onHtmlLoad(onloadprocess);
function onloadprocess(){
var block = document.getElementById('banner_block');
event_controller.addHandler(window,'scroll',move_block);
move_block();
}
и далее в зависимости от того насколько прокручена страница определяем какое из трех состояний (вверху, внизу или на 10 точек от верха экрана.).
PHP:
function move_block(){
var block = document.getElementById('banner_block');
var footer = document.getElementById('FLfooter');
var scroll = get_scroll();
if(scroll>124){
if(scroll+10+block.offsetHeight>=footer.offsetTop){
block.className="banner_block_bottom";
}else{
block.className="banner_block_fixed";
}
}
if((scroll<=124)&&(block.className!="banner_block")){
block.className="banner_block";
}
}
function get_scroll(){
if(window.scrollY==undefined){
return parseInt(document.documentElement.scrollTop);
}
return parseInt(window.scrollY);
}
Ну и собственно стили:
PHP:
.banner_block{
position:absolute;
left:-12px;
top:134px;
}
.banner_block_bottom{
position:absolute;
left:-12px;
bottom:130px;
}
.banner_block_fixed{
position:fixed;
top:10px;
margin:0 0 0 -12px;
}
Ничего сверхестественного. Что я мог упустить? Почему оно может дергатся???
Очень рассчитываю на вашу помощь - я в отчаянии.