许多元素的jQuery fadeTo（）性能

我正在图像库中做一个很酷的褪色悬停效果，以指示你在哪一个上空盘旋 - 但是当有超过20个图像时，它确实会杀死性能。许多元素的jQuery fadeTo（）性能

以下是我正在做它（非常基本的）

$('img').on('hover', function(){ 
    $(this).stop().fadeTo(100,1); 
    $('img').not($(this)).stop().fadeTo(100,.5); 
});

没有人有优化的这个好位，或更好的方法来做到这一点摆在首位？

请不要说'只是使用CSS'，这已经在那里作为后备。

来源

2012-03-05 jammypeach

对不起，但你想成为'使用CSS'回落到内置的图形浏览器功能..所以你想要使用CSS，而不是JS！作为这篇文章JS不使用你的图形卡，但在内存（有限和隔离CPU线程）纯数学..性能变得很快poo ..使用CSS3！如果用户没有CSS3，请立即告诉他们升级！ – ppumkin 2012-03-05 16:29:53

@ppumkin就像我同意你一样，不幸的是我不能强迫我的用户升级（尽管我真的很喜欢）。除此之外，我将如何使用CSS3实现这一目标？坚持在一个答案，我可能会接受 – jammypeach 2012-03-05 16:34:58

试试这个，看看性能是否改善：

$('img').on('mouseenter', function(){  
    $(this).fadeTo(100, 0.5); 
}).on('mouseleave', function(){  
    $(this).stop(true).fadeTo(100, 1); 
});

的jsfiddle这里：http://jsfiddle.net/26w5q/

看起来工作得很好。

来源

2012-03-05 16:38:49

aaaah，ofcourse :)非常有意义，因为你只是动画的一个元素，而不是所有的人。今天没有我的思想上限......先生，你赢了互联网。 – jammypeach 2012-03-05 16:41:58

哈哈，虽然很容易错过，祝你好运，但你的jQuery很好玩！ :) – 2012-03-05 16:43:29

你会有这个解决方案在IE6,7,8的巨型问题:( – ppumkin 2012-03-05 16:44:03

许多元素的jQuery fadeTo（）性能

回答

相关问题