2012年7月11日水曜日

PAGE TOPへなどjsで上にスクロールするやつ

  • このエントリーをはてなブックマークに追加

最近のwebサイトによくあるようなjsで上にスクロールするやつの作り方。
実際にこれを設置しておくと縦に長い場合とか、ブラウザの縦サイズが短い場合など便利。
ってことでこれの作り方↓


$(document).ready(function(){
  $(".toTop").bind({
    click:function(e){
      e.preventDefault();
      $('html,body').animate({
        scrollTop:0
      },300,'swing');
      return false;
    }
  });
});
<a href="#" class="toTop">●●●</a>に対してイベントを追加する感じ。

e.preventDefault()はaタグをクリックした際の、
デフォルトのイベントをなくすためにあえての記述。
ちなみにreturn falseがないとブラウザによってはうまく動かなかったり。

0 件のコメント:

コメントを投稿

Adsense