Плавный переход к якорю внутри DIV блока. Не HTML, не BODY

Здравствуйте!

Возникла проблема с точным переходом по якорю с использованием jQuery. Если я проматываю до самого верха и нажимаю ссылку “ВНИЗ”, то якорь оказывается где-то выше верхней границы, если немного вниз проматываю, так что ссылка “ВНИЗ” оказывается вверху и нажимаю на нее, то якорь оказывается ниже верхней границы. Подскажите пожалуйста как изменить код чтобы якорь всегда на верхней границе оказывался? Код который я использую:

Я не до конца понял проблему. Но попробуй разместить <a id="up" /><a id="down" /> друг за дружкой. Тогда прокрутка что up что down будет стремиться к одной точке где расположены оба эти элементы.

Неа, мне не надо чтобы они в одном месте были, мне надо чтобы при переходе к якорю я попадал точно в якорь, а не в неизвестно какое положение. При переходе к якорю в этом примере к якорю не переходит на самом деле.

Я правильно понимаю что таких элементов <a id="up" /><a id="down" /> на странице больше одной пары?

Больше. Но даже в этом примере я смог воспроизвести проблему. А так у меня, даже при том что якорь находится ниже ссылки, переход происходит куда-то вверх

Скроллится к первому найденному якорю. Поиск якоря происходит в строке dn=$(sc). А sc - селектор по которому ищется якорь. И это селектор сегодня такой, что он находит самый первый верхний якорь. Тебе нужно поменять логику так чтобы селектор находил желаемый якорь.

Проблема то в том что у меня все якоря уникальные, это во первых, а во вторых куда у меня переход происходит, там нет вообще никаких якорей. Положение якоря dn неправильно рассчитывается, вот и переходит куда получится и я не могу понять почему он его так рассчитывает.

могу предположить что - функция где var cs = $(this).attr("href") - ищет первый элемент на сайте у которого есть аттрибут href, это может быть даже не якорь а какая то обычная ссылка с аттрибутом href, например ссылка в шапке с номером телефона, или ссылка меню

Где в моем примере есть href, корме как в ссылке? Я специально сделал такой вот пример. Если его выполнить, можно увидеть проблему которую я пытаюсь решить. Может сюда можно как-то разместить код в текстовом виде, чтобы я мог его скинуть, а вы попробовать и понять проблему? Я видимо не могу правильно сформулировать проблему, ее надо увидеть.

Вот этот код прекрасно работает, потому что относится ко всему документу и я вместо $(‘div’).animate({scrollTop: dn}, 1000); использую $(‘html, body’).animate({scrollTop: dn}, 1000);

Мне надо именно чтобы переход происходил внутри DIV блока, и тот же самый код внутри блока DIV работает некорректно.

Спасибо всем, за уделенное мне время. Проблема решена. Если кому-то понадобится то решение оказалось очень простое - сделать позицию DIV блока, в котором хотите делать плавные переходы, как relative -