Question

我有问题。在我的网站上我添加了一个效果：当有人悬停缩略图时，其他不透明度会随着jQuery动画而减少。它完全适用于FF和IE，在Chrome中存在一个问题：在动画期间，一些缩略图向左或向右移动1个像素。

两个示例链接：first和second。

这是jQuery函数：

var GALLERIE = {
thumbHover : function(contenitore){
    var $immagini = $(contenitore).find('img');
    $immagini.parent('a').hover(
    function(){ $immagini.not($(this).find('img')).stop(true).animate({opacity:'0.8'},400)},
    function(){ $immagini.not($(this).find('img')).stop(true).animate({opacity:'1'},400)}
    )
}

};

Answer 1

我只看第一个例子。

我注意到即使简单地将任何不同于1的不透明度设置为img，parent a，parend td或event parent tbody，图像也会移动。我还注意到，转移只发生在第一列。关于第一列有一些奇怪的事情：左上图像是146px x 216px但其父图像是147px宽。第一列中的其他元素存在相同的差异。当我把左上角的样式改为

时

position: relative;

左上方元素的所有故障都消失了。可以说这个错误以某种方式连接到表格单元的33％宽度和块的ceter-align。

Answer 2

为图像添加背景颜色似乎神奇地为我解决了这个问题。有多奇怪请注意，不仅仅是jQuery，当我在firebug中将不透明度从1更改为0.99时，图像移动了（缩小了1px）。

jQuery动画不透明度bug（移动图像）

2 个答案: