Как реализовать плавный скроллинг от текущего до заданного положения?

Question

[andreyqin]

Добрый день. Есть вот такой код:

var scroll = document.cookie;
if (scroll) {
	$('html').animate({scrollTop: scroll.split('=')[1]}, 600);
	document.cookie = 'scroll=0';
}
$('.sidebar').on('click', 'a', function() {
	document.cookie = 'scroll=390';
});

Проблема в том, что он всегда начинает скроллить с начала страницы, а мне нужно как-то запоминать текущее положение (например, можно так же в куках), а после перезагрузки страницы проскролливать по принципу "от текущего до заданного положения". Не получается реализовать. Кому не сложно, помогите.

Answer 1

[PaulZi]

Подключить ещё библиотеку jQuery Cookie, для нормального получения значения кук:

var ascroll = function(anim, to)
{
	if(to===undefined)
		to = parseInt($.cookie('scroll'), 10);
	else
		$.cookie('scroll', to);
	if(anim)
		$('html').animate({scrollTop: to}, 600);
	else
		$('html').scrollTop(to);
};

$(function(){
	ascroll(false);
});

Comments

[andreyqin]

Хм, почему-то ваш пример так же начинает прокрутку с начала страницы. Если не сложно, можно рабочий пример.

[PaulZi]

jsfiddle.net/78w3y
Нажимайте ссылки "to 4", а потом перезагрузите страницу - должен скролл сохраниться.
Или я просто задачу не понял?

[andreyqin]

В реальности все обстоит так: у меня есть меню, которое располагается на расстоянии 390px от верхней части окна. При клике на определенный пункт меню, страница перезагружается и скролл плавно проматывается до уровня этого меню. Мой код выполняет эту задачу с одним НО: если мы нажали на пункт меню, находясь чуть ниже верхней части окна, например, на 50px, то после перезагрузки прокрутка начинается с верхней части, а не с этих 50px. При этом есть еще сайдбар, который располагется ниже этого меню. На ссылках сайдбара тоже стоит онклик. И получается так, что мы кликаем на сайдбар, который ниже, страница перезагружается, стролл резко подпрыгивает в начало окна и плавно спускается вниз. А хотелось бы, чтобы просто с текущего положения поднимался вверх, до нужного значения.

[PaulZi]

Ну так у вас всегда стоит анимация, даже после перезагрузки страницы, поэтому анимация и идёт. У меня в примере при инициализации страницы я отключаю анимацию, и прокручиваю моментально.
Кроме-того, следует учесть, что при полной перезагрузки страницы, скролл всегда ставится в верхнее положение = 0. Если нужен плавный скроллинг между переходами страниц, в любом случае нужно отказываться от полной перезагрузки страницы в пользу AJAX, без этого идеальной плавности не будет в любом случае.

[andreyqin]

Вот я тоже так подумал, что перезагружая страницу полностью, нужного мне эффекта не достичь. Ладно, спасибо за участие и за помощь, оставлю прокрутку без анимации.