我有以下内容,通过 AJAX 加载。
<div class="grid">
<div class="thumb">
<img alt="AlbumIcon" src="some-image.jpg">
<div style="bottom:-75px;" class="meta">
<p class="title">Title</p>
<p class="genre"> <i class="icon-film icon-white"></i>
Genre
</p>
</div>
</div>
</div>
此外,我用jquery编写了以下脚本,适用于上面的'div.grid'。
jQuery(function ($) {
$(document).ready(function () {
$(".grid").on({
mouseenter : function () {
$(this).find('.meta').stop().animate({
bottom:'0px'
},200);
},
mouseleave : function () {
$(this).find('.meta').stop().animate({
bottom:'-75px'
},200);
}
});
});
});
脚本在页面第一次加载时运行良好。但是,当通过单击“a”标签生成上面的div后,悬停效果将不起作用。我似乎无法找出问题所在?对此完全陌生。有人能帮忙吗?