Question

实际上，我看到了this教程，可以将鼠标放大到图像上这里的图像不在任何表中，因此我可以通过将图像放入其中来实现相同的效果表并将图像的位置设置为相对？

喜欢

    <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>

当我试图将图像放在一个表格效果正在改变时，它也增加了大小表的大小，但表的大小应该保持不变。

我正在使用以下代码为图像放大和缩小效果，但它在mozilla firefox中运行良好，但在谷歌浏览器中不起作用。在chrome中它也扩展了表列大小，（z-index不工作），img1在表标记内。

  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");

        }
    }

Answer 1

当我读到您的问题时，我认为您正在寻找类似http://jsfiddle.net/8umD4/4/之类的内容。

 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>

检查出来。如果不符合您的要求，请详细说明您的问题。

放大鼠标悬停在表格内的图像

1 个答案: