クロワッさん。技術メモ。

Webクリエイタークロワッさん。のメモがわり備忘録。

jQuery

jQueryでスムーススクロール付けたい!

投稿日:2018年10月28日 更新日:

jQuery読み込んでこれをHTMLに貼っておけばOK!

読み込み方はこちら

$(function(){
  $('a[href^="#"]').click(function(){
    var speed = 500;
    var href= $(this).attr("href");
    var target = $(href == "#" || href == "" ? 'html' : href);
    var position = target.offset().top;
    $("html, body").animate({scrollTop:position}, speed, "swing");
    return false;
  });
});

 

speedの値を変えればスクロール時のスピードを変えられるぞ!







-jQuery

関連記事

jQuery hoverアクションのやり方

jQuery hoverアクションのやり方 $(“アクションを付加したい要素”).hover( function(){ ホバーしたときの処理 }, function(){ 離し …

jQueryのCDN一覧

jQuery読み込む時のCDN忘れがちだからメモ! jQueryの本サイトから <script   src=”https://code.jquery.com/jquery-2.2.4 …

lightbox IEだけ表示が違う

今日lightboxで出たエラー。 IEだけ表示が違う。 他のブラウザは画面横幅に応じたサイズになるのに対し、 IEは縦幅にも応じ、画面に納まるサイズで表示される。 当然IEを疑う。 いろいろ調べてい …

フルオーダーメイドのカリキュラム作成できるエンジニア塾【Samurai】