jQuery動畫不透明錯誤（移動圖像）

Question

我有一個問題。在我的網站中，我添加了一個效果：當有人將縮略圖懸停時，其他透明度會隨着jQuery動畫而降低。 它在FF和IE中完美工作，在Chrome中存在一個問題：在動畫過程中，一些縮略圖向左或向右移動1px。

兩個示例鏈接：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，父a，parend td或事件父tbody，圖像也會移動。我還注意到，轉移只發生在第一列。關於第一列有一些奇怪的事情：左上圖像是146px×216px，但其父圖像寬度是147px。第一列中的其他元素也存在同樣的區別。 當我改變了左上的風格

position: relative; 

與左上角元素的所有毛刺就走了。人們可以說這個錯誤以某種方式與該塊的表格單元格的寬度和對齊的33％寬度相關聯。

Answer 2

爲圖像添加背景色似乎神奇地解決了這個問題。多麼奇怪。請注意，它不僅與jQuery，當我在螢火蟲中將不透明度從1更改爲0.99時，圖像移動（收縮1px）。