Как сделать анимацию плавнее при прокрутке страницы?

Question

[Дима Паутов]

У меня есть 2 блока, которые разъезжаются при прокрутке страницы.

$(window).on('load scroll', function(){
var scroll = $(this).scrollTop(),
			guy = $('#guy'),
			time = $('#time');

		guy.css({
			'-webkit-transform': 'translate3d(-'+scroll+'px, 0, 0)',
			'-moz-transform': 'translate3d(-'+scroll+'px, 0, 0)',
			'transform': 'translate3d(-'+scroll+'px, 0, 0)'
		});
		
		time.css({
			'-webkit-transform': 'translate3d('+scroll+'px, 0, 0)',
			'-moz-transform': 'translate3d('+scroll+'px, 0, 0)',
			'transform': 'translate3d('+scroll+'px, 0, 0)'
		});
});

Все отлично работает, но ведь мы скролим мышкой по умолчанию 100px и эти 2 блока дрыгаются. Если зажать на полосу прокрутки мышкой и прокручивать, то все идеально. Подскажите, как можно избавиться от такого поведения?

Answer 1

[Денис Инешин]

Добавить transition, это анимирует скачки. Настроить можно тут: matthewlein.com/ceaser