Поделиться
Плюсануть
Телеграмнуть

Для вставки кода используйте HTML-теги
<pre><code class="php">ваш код</code></pre>

Добавить комментарий

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

Нажимая на кнопку "Отправить", я даю согласие на обработку персональных данных.

24 комментария

сначала новые
по рейтингу сначала новые по хронологии

Внедрил у себя. Спасибо.

Виталий

Второй способ так и не сработал, зато первый работает на ура. Еще бы разобрать что там к чему.

Дмитрий

А как можно спустится вниз?

Автор
Кобзарёв Михаил

Аналогично

Поставить якорь внизу 🙂

А как сделать плавную прокрутку вниз к якорю?

Автор
Кобзарёв Михаил

А в моем примере разве не плавная прокрутка к якорю? Или вы имеете ввиду что-то другое?

Максим

А как быть если скролл производится по внешней ссылке до якоря на странице. Например я добавил сообщение и меня перемотало на место где оно добавлено на новой странице(ссылка вида http://mypage.ru/index.php#myanchor_xx).

Максим

Решил, но коряво:

scroll(0,0);//чтобы отмотать к 0,0 потому как браузер уже перепругнл на ссылку

var anch=location.href;

anch=anch.substring(anch.indexOf('#')+1);

if (anch!=''){

anchDist=$("a[name="+anch+"]:first").offset().top;

$("html, body").stop().animate({scrollTop: anchDist-150}, 1100 );

}

Автор
Кобзарёв Михаил

То есть ссылка стоит на другом ресурсе? И при клике по ней вы хотите перейти на сайт и промотать страницу?

Максим

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

По сути необходимо при создании страницы скролл сделать плавным, а потом его сделать его обычным

Добрый день.

А если вместо :

[html]<a href="#top" rel="nofollow">Наверх</a>[/html]

написано:

[html]<a href="/contents/page/#top" class="scrollto" rel="nofollow">Наверх </a>[/html]

сниппет изменится?

Автор
Кобзарёв Михаил

Конечно же нет. Скрипту важно лишь наличие якоря в атрибуте href

Прокрутка работает только вверх? или вниз тоже будет работать?

Автор
Кобзарёв Михаил

И вверх и вниз.

А не пробовали сделать автоматическое появления надписи "Наверх" при прокрутке вниз, и исчезание, когда страница снова прокручена максимум наверх? И как дела с кроссбраузерностью. Не могу найти ни один нормальный кроссбраузерный скрипт...

Автор
Кобзарёв Михаил

Делал. Вас интересует реализация?

А зачем проверять :animated? Если по ссылке нажали, то нужно выполнить действие. Решение

[javascript]$("html,body")stop().animate({ scrollTop: targetOffset}, 1100 );[/javascript]

удачнее - http://jquerylist.ru/snippets/smooth-scrolling.html

спасибо большое!

Автор
Кобзарёв Михаил

Спасибо за наводку, подправил свою реализацию.

ужас какой, посмотрите в опере 10.52

Автор
Кобзарёв Михаил

Какие проблемы вы видите? Скрин можно?

Здравствуйте. Пытался вставить Ваш скрипт, но что-то не получается... Может распишете чуть-чуть подробнее для ламера???

Автор
Кобзарёв Михаил

В чем, собственно, проблема?