Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как реализовать анимацию при прокрутке (https://javascript.ru/forum/jquery/40835-kak-realizovat-animaciyu-pri-prokrutke.html)

sabano 21.08.2013 16:54

Как реализовать анимацию при прокрутке
 
Привет
Подскажите как реализовать такую штуку

Нужно воспроизвести анимацию при прокрутке

у div задан длинный спрайт

я хочу, чтобы менялось положение фона этого div при прокрутке страницы

у меня получилось плохо
фон прокручивается мгновенно
а нужно плавно
function y600(){
	y600.y += 600;
	return y600.y;
}
y600.y = 600;

$(window).scroll(function() {

	var x = $(this).scrollTop();

	if ($(window).scrollTop() > 2260) {
		$("#sprite").css('background-position', '0% ' + y600() + 'px');
	}

});

Tek 22.08.2013 10:20

чёт у вас какой то бред написан:
1)нужно знать две величины высоту страницы (px) и высоту спрайта (px) - зная это мы можем узнать на сколько пикселей двигать спрайт при изменении .scrollTop()
2) функция y600() прибавляет каждый раз 600 пикселей т.е если вы подвинете скролл на 1 пиксель то спрайт сдвинется на 600 px - это явно неправильно.

sabano 23.08.2013 23:38

хм,
в событии scroll отмерять пройденное расстояние и с нужным промежутком менять позицию фона блока, так?
Я не знаю как реализовать эти промежутки

Если не сложно помогите.
К примеру пусть при одной прокрутке background по y увеличивается на 50px
Вот тут заготовка
http://jsfiddle.net/vYteS/

sabano 24.08.2013 11:52

тут лучше http://jsfiddle.net/vYteS/1/


Часовой пояс GMT +3, время: 08:55.