如何使用jquery放大和縮小圖像？

Question

我有以下代碼

<div class="c1"> 
    <div class="d1"> 
     <img /> 
     <img /> 
     <img /> 
    </div> 
</div> 

1.有包含在標籤GIF圖像。這些圖像是透明的，它們的一部分用透明黃色補丁高亮顯示。 2. css類應用於內部div類，並且有類型jpeg的背景圖像在css類的幫助下被分配給內部div類。 3.外部div可以通過應用於它的css類的幫助進行滾動。

我想借助jquery在div內的圖像圖像上進行放大和縮小。

所以有可能放大和縮小圖像的幫助下jQuery的？ 它的簡單代碼是什麼？

等待你的回覆啦！

謝謝！

Answer 1

背景無法縮放，只有<img>標籤可以。

你可以把圖像放在div，其中div有overflow:hidden;，然後縮放圖像。

你可以看到一個簡單的例子在這裏： http://jsbin.com/ozugi3/2

http://jsbin.com/ozugi3/2/edit

Answer 2

的Kabbar圖像縮放器可以解決你的問題： http://www.ideabonus.com/Kabbar/index.html

Answer 3

****here is the script**** 
     <script src="Script/jquery-1.7.1.min.js" type="text/javascript"></script> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#Img1, #Img2, #Img3').mouseover(function() { 
       $(this).animate({ width: "122px", height: "110px" }, 100); 
      }); 
      $('#Img1, #Img2, #Img3').mouseout(function() { 
       $(this).animate({ width: "118px", height: "106px" }, 100); 
      }); 
     }); 
     </script> 
**Aspx code** 
<img src="Images/home.jpg" id="Img1" width="118" height="106" border="0"> 
<img src="Images/machine.jpg" id="Img2" width="118" height="106" border="0"> 
<img src="Images/title_Mixie.jpg" id="Img3" width="118" height="106" border="0"> 

Answer 4

試試這個link放大圖像配與這段代碼很好的結合在一起。