Заметки дизайнера » Плавный скролл по странице на jquery

Стандартные шрифты windows список систем (win XP, Vista, 7, 8) Усиление резкости изображения в Adobe Photoshop

Плавный скролл по странице на jquery

Якорь это метка, до которой мы осуществляем переход, с какой либо ссылки в которой указан этот якорь #go1 это будет означать что перейти нам нужно до тега на странице у которого указан id=go1 или name=go1

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

$(document).ready(function() {<br />
    $("a.scrollto").click(function () {<br />
        var elementClick = $(this).attr("href")<br />
        var destination = $(elementClick).offset().top;<br />
        jQuery("html:not(:animated),body:not(:animated)").animate({scrollTop: destination}, 800);<br />
        return false;<br />
    });<br />
});

Можно конечно и так

И еще так

$(document).ready(function(){<br />
   $('a[href*=#]').bind("click", function(e){<br />
      var anchor = $(this);<br />
      $('html, body').stop().animate({<br />
         scrollTop: $(anchor.attr('href')).offset().top<br />
      }, 1000);<br />
      e.preventDefault();<br />
   });<br />
   return false;<br />
});

P.S.: Все эти примеры работают с обычным способом перехода по якорям, так что при отключенном скрипте, будет все переходить как надо, как обычно скачком, просто без анимации

Авиабилеты на все направления

Добавить в: