2012年6月4日月曜日

jQueryで読み込んだ中で更にjQuery

Sliding Boxes and Captions with jQuery jQueryを使ったコンテンツはbindするタイミングの問題で、後からloadしたりするとうまく動かないことがあります。live()を使うことでダイナミックにbindすることができるようです。 変更前
$('.boxgrid.caption').hover(function(){
$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160});
}, function() {
$(".cover", this).stop().animate({top:'260px'},{queue:false,duration:160});
});
変更後
$('.boxgrid.caption').live("mouseover mouseout", function(e){
if (e.type == 'mouseover') {
$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160});
} else {
$(".cover", this).stop().animate({top:'220px'},{queue:false,duration:160});
}
});
hover()は、mouseoverとmouseoutの組み合わせでlive()にできる。 これで後から$('#content').html(origContent);なんかで戻してもちゃんと動くようになりました。

0 件のコメント:

コメントを投稿