ホーム > WordPress > スムーズスクロールのスピードを緩める

スムーズスクロールのスピードを緩める

2014 年 1 月 26 日 こてつ コメントをどうぞ コメント

昨日の、アンカへのリンクにスムーズスクロールする。。の続き。

ここのブログで使っているテンプレがどうなっているのか。。

は、さておき(しっかり調べなかった(爆)

イイ感じのを見つけましたので。。


jQueryでページ内スムーズスクロール

 

jQueryで スピードの変化をさせる場合などには、エフェクト機能?効果?を加える

jQuery Easing Plugin(jquery.easing.1.3.js)

というものを使用するそうです。

 

それもヘッダで読み込んだ上で、昨日作った「scrollup.js」を改造。

$(function(){
  $('a[href^=#]').click(function(){
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length && target;
      if (target.length) {
        var sclpos = 30;
        var scldurat = 1200;
        var targetOffset = target.offset().top - sclpos;
        $('html,body')
          .animate({scrollTop: targetOffset}, {duration: scldurat, easing: "easeOutExpo"});
        return false;
      }
    }
  });
});

スポンサード リンク
 

 
カテゴリー: WordPress タグ:

Yahoo!ブックマークに登録 はてなブックマークに登録 Deliciousに登録 livedoorクリップに登録 Buzzurlに登録 mixiチェック Facebookにシェア ツイートする

  1. コメントはまだありません。
  1. トラックバックはまだありません。