Jquery 将鼠标悬停在桌子内放大图像

实际上，我看到了一个教程，该教程提供了将鼠标移到图像上的放大效果 这里的图像不在任何表格中，所以我可以通过将图像放入 表格并将图像的位置设置为相对

像

---

当我读到你的问题时，我想你正在寻找类似的东西

img：悬停
{
保证金：0；
填充：0；
宽度：90%；
身高：90%；
}
.可格式化的td
{
宽度：100px；
高度：100px；
文本对齐：居中；
}  

---

看看吧。如果不符合您的要求，请详细解释您的问题

事实上看起来效果不错。在您的情况下，表的列大小已经非常大，它是否可以与图像相同，并且在鼠标悬停时，只有图像才能获得放大效果。确定要保持此效果，现在看我的小提琴，我已经更新了它。谢谢你的努力，但是如果我像这样更改它jsfiddle.net/8umD4/15/现在你能保持同样的效果吗？要放大表格中的图像，你必须将表格单元格的大小设置为大于图像的大小，否则在放大图像时，表格的大小将根据图像的大小而变化形象。现在检查这个。jsfiddle.net/8umD4/16这是相同的，您刚刚删除了表的边框，但我需要表的边框，并且表列大小应该与鼠标悬停时的图像大小相同。图像应该放大，但不是表列，表列应该保持相同的大小。我甚至不知道这是否可能。谢谢你的回复

    <table border = '2'>
     <tr>
      <td>
         <img id="a1" src="http://demos.frnzzz.com/imgZoom/1.jpg" height="50"  width="50">
      </td>
      <td>
         <img id="a2" src="http://demos.frnzzz.com/imgZoom/1.jpg" height="50" width="50">
      </td>
     </tr>
    </table>

  function zoomIn(indexNo){
    var zoomin = $('#img1').attr("zoomin");
    if(zoomin == "false")
        {
            $('#img1').css("z-index", 1);
            $('#img1').css("position", "absolute");
            $('#img1').animate({
               height  :    l_imgHeightZoomIn,
               width   :    l_imgWidthZoomIn,
               left    :    l_imgLeftZoomIn,
               top     :    l_imgTopZoomIn
            }, "slow");
            $('#img1').attr("zoomin", "true");
        }
    }
--------------------------------------------------------------
  function zoomOut(indexNo){
    var zoomin = $('#img1').attr("zoomin");
    if(zoomin == "true")
        {
            $('#img1').css("z-index", 0);
            $('#img1').css("position", "static");
            $('#img1').animate({
                height : l_imgHeight,
                width  : l_imgWidth,
                left   : l_imgLeftZoomOut,
                top    : l_imgTopZoomOut
            }, 0);
            $('#img11').attr("zoomin", "false");

        }
    }

 img:hover
 {
   margin:0;
   padding:0;
   width:90%;
   height:90%;
 }
.formatTable td
{
width:100px;
height:100px;
text-align:center;
}  
<table border = '2' class='formatTable'>
 <tr><td>
    <img id="a1" src="http://demos.frnzzz.com/imgZoom/1.jpg" height="50" width="50" />
   </td>
   <td>
    <img id="a2" src="http://demos.frnzzz.com/imgZoom/1.jpg" height="50" width="50"/>
   </td>
 </tr>
</table>