0

我有一个网站,其中包含从网格到列表的切换 jQuery 函数。在另一个外部 .js 文件中有以下函数

$(function (){
$('.image a img').hover(
function () {
     $(this).stop().fadeTo('slow', 0.7);
     },
function(){
    $(this).stop().fadeTo('slow', 1);
}
);
});

这只是第一次工作。如果我从“网格”切换到“列表”,反之亦然,它就不再起作用了。

在谷歌开发者工具中,内联样式在切换后消失。是否有任何简单的解决方案可以“重新加载”上述功能?

4

3 回答 3

0

我会尝试这样的“

$( '.image a img' ).on({
     mouseenter: function() {

        $( this ).stop().fadeTo('slow', 0.7);

      },
      mouseleave: function() {

        $( this ).stop().fadeTo('slow', 1);

     }
   });
于 2013-04-25T17:22:28.827 回答
0

为了确保我必须查看更多代码,但也许原因是引用的函数将.hover事件绑定到绑定时刻匹配查询$('.image a img')的所有元素(这是在文档就绪事件上),所以如果您稍后添加新元素(编辑:我猜,你的切换功能是哪个?),即使匹配查询$('.image a img') .hover也不会为它们定义。切换到$(.image container').on("mouseenter mouseleave",'.image a img', handlerInOut),其中.image container的元素在哪里.image a img,看看它是否有帮助。

于 2013-04-25T17:22:53.063 回答
0

问题是您没有重置队列。因此,如果您将鼠标悬停/鼠标快速移出。它什么也不会显示。尝试这个:

$('body').on("mouseenter", ".image a img", function () {
     $(this).stop(true, false).fadeTo('slow', 0.7);
   })
.on("mouseleave", ".image a img", function(){
    $(this).stop(true, false).fadeTo('slow', 1);
});

这将重置队列,但不会跳到最后。此外,您可以使用 LIVE 元素使事件在所有更改的项目上保持活动状态。从 1.8 开始在新的 jQuery 中启用

于 2013-04-25T17:05:35.740 回答