jQuery圖像動畫

Question

我有一排圖像，當鼠標懸停時生成變形的jQuery（縮放效果），然後恢復到原始大小，然後鼠標移出。

問題是，當圖像變焦時，它會增加其大小，並將表格的其他圖像推向兩側。

它有一種方法來防止這種情況？即使圖像超出另一個。

下面是代碼：

$(document).ready(function(){ 
    $("img.menu").mouseover(function(){ 
    $(this).animate({height:300,width:300,opacity:1.0},"fast"); 
    }); 
    $("img.menu").mouseout(function(){ 
    $(this).animate({height:256,width:256,opacity:1.0},"fast"); 
    }); 
}); 

的img.menu圖像被放置在一個HTML表格行。

的圖片在這裏：

<table border="0" width="700" height="350"> 
<tr> 
<td><img id="about" class="menu" src="img/agenda.png" /></td> 
<td><img id="links" class="menu" src="img/laptop.png" /></td> 
<td><img id="toolbar" class="menu" src="img/hd.png" /></td> 
</tr> 
</table> 

每一個都是256×256默認

Answer 1

嘗試這樣的事情

$(document).ready(function(){ 
    $("img.menu").mouseover(function(){ 
    $(this).css({'z-index':'9999','position':'absolute'}); 
    $(this).animate({height:300,width:300,opacity:1.0},"fast"); 
    }); 

    $("img.menu").mouseout(function(){ 
    $(this).css({'z-index':'','position':''}); 
    $(this).animate({height:256,width:256,opacity:1.0},"fast"); 
    }); 
});