Как добавить стили для блока, при скролле страницы?

Question

[hax0r :3]

Здравствуйте друзья, у меня вопрос, я его не так давно задавал уже... ну так вот, как добавить box-shadow для блока, при скролле страницы, желательно на jQuery, буду очень благодарен за помощь! =)

Answer 1

[Ilya Suhodolskiy]

$(window).scroll(function(){
     $('.block').css({
	         property1: 'value1',
	         property2: 'value2'
     });
});

Comments

[hax0r :3]

Спасибо, а как сделать что если обратно скролить будешь, он прежние свойства принимал?

[Ilya Suhodolskiy]

$(window).scroll(function(){
var scrollTop = $(this).scrollTop();

if(scrollTop > 100){
// ...
} else{
// ...
}
});

[Дмитрий Гавриленко]

Илья Суходольский: позвольте спросить. Вот делают страницы, при прокрутке которых появляются какие либо элементы. При готовом решении высчитывают topScroll для каждого элемента и точно так же на условиях реализуют появление?

[Ilya Suhodolskiy]

Дмитрий Гавриленко: попробуйте так

$(window).scroll(function(){
var scrollTop = $(this).scrollTop();
// Element 1
if(scrollTop > 100){
// ...
} else{
// ...
}
// Element 2
if(scrollTop > 25){
// ...
} else{
// ...
}
});

[Дмитрий Гавриленко]

Илья Суходольский: мне код не нужен) Я просто спрашивал так ли делают или есть какие-то более изощрённые методы)

Answer 2

[Дмитрий Б]

Заменить scroll на плагин jQuery и можно будет делать с ним что хочешь

Comments

[hax0r :3]

А можете мне что ли ссылку дать, или хотя бы сказать как он называется)

[Дмитрий Б]

fEs: у меня пока что нет любимого плагина скрола

[Дмитрий Б]

fEs: как вариант gromo.github.io/jquery.scrollbar

[hax0r :3]

Дмитрий Байбухтин: Спасибо попробую.

[Дмитрий Б]

fEs: а вообще не рекомендую трогать основной скролл. Если и заменять, то только внутренние

[hax0r :3]

Дмитрий Байбухтин: Да я не скролл заменить хочу, а что бы при прокрутке страницы, у панели инструментов появлялась тень)

[Дмитрий Б]

fEs: аа, извини. Я понял как хочешь тень для скролла. Тогда надо отлавливать событие скролла и устанавливать нужный класс, если страница прокручена на определённое количество пикселей. ruseller.com/jquery?id=123
Как определить на сколько прокручено не помню