jQuery snippets

eyecatchImg

jQueryのよく使われるスニペットパターン。お決まりのパターンなので登録しておくと便利。

トップへ移動

$('#goTop').on('click',function(){  

    $('html,body').animate({scrollTop:0},1000);  
    return false  
});

ページ内アンカーをアニメーション化

$('a[href^=#]').on('click',function(){  

    var Target=$(this.hash)  
    ,    TargetOffset = Target.offset().top;  

    $('html,body').animate({scrollTop:TargetOffset},1000);  
    return false  
});

onを用いたtoggle(例:hover系)

$('#element').on({  
    'mouseenter':function(){  
        $(this).toggleClass();  
    },  
    'mouseleave':function(){  
    $(this).toggleClass();  
    }  
});

エラー処理(例:画像がエラーだった場合、置き換える)

$('img').error(function(){  
     $(this).attr('src', ‘image/no-image.jpg’);  
});

再読み込みを止める

$('a').on('click',function(e){  
      e.preventDefault();  
});