Question

我在databale的最后一列显示了img缩略图

.img-zoom {
width: 310px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
}

.transition {
-webkit-transform: scale(2); 
-moz-transform: scale(2);
-o-transform: scale(2);
transform: scale(2);
}

img-zoom class css：

$('.img-zoom').hover(function() {
    $(this).addClass('transition');

}, function() {
    $(this).removeClass('transition');
});

但是当我转到第二页时缩放图像不起作用... 在第一页上它的工作...... 我怎么能在这里使用fndrawcallback？或者还有其他选择吗？

{{1}}

Answer 1

使用委托事件处理程序 - 执行代码时页面＃2的内容不可用，这就是为什么缩放不在页面＃2上工作：

$('#datatable4').on('mouseenter', '.img-zoom', function() {
    $(this).addClass('transition')
})
$('#datatable4').on('mouseleave', '.img-zoom', function() {
    $(this).removeClass('transition')
})

<强>更新即可。我不建议使用hover伪事件名称，与hover()做同样的事情。我的错。请改用以上解决方案，这是一个演示 - ＆gt; http://jsfiddle.net/wa0oykv7/ 找到例如seq #57（最后一行）并将鼠标悬停在具有类.img-zoom的第一列上。

悬停缩放不适用于数据表的第二页

1 个答案: