使用jQuery CSS的圖像縮放功能

我已經創建了腳本，它可以在單擊事件時動態更改產品圖像，但是當鼠標移動到大圖像上時，我需要在大圖像上添加縮放功能。使用jQuery CSS的圖像縮放功能

HTML代碼

<ul class="thumbelina" style="top: -220px;"> 
    <li style="display: block;"> 
     <img class="showBigImage" src="/Chrysanthemum-69x52.jpg" data-fullurl="/Chrysanthemum.jpg"> 
    </li> 
    <li style="display: block;"> 
     <img class="showBigImage" src="/Lighthouse-69x52.jpg" data-fullurl="/Lighthouse.jpg"> 
    </li> 
    <li style="display: block;"> 
     <img class="showBigImage" src="/Penguins-69x52.jpg" data-fullurl="/Penguins.jpg"> 
    </li> 
</ul> 
<div> 
    <img class="bigImage" src="/Penguins.jpg" /> 
</div>

的JavaScript

$(".showBigImage").click(function(){ 
    var FullImageUrl = $(this).data("fullurl"); 
    $(".bigImage").attr("src", FullImageUrl); 
});

來源

2015-06-02 Mitul

的onfocus - >動畫新的高度和寬度，

這是你想要達到什麼樣？我無法給出更好的答案，因爲這個問題對我來說有點不清楚。如果你想要一個更好的答案，請爲我擴展你的問題

來源

2015-06-02 13:43:08 santinobonora

當鼠標移到大圖上時，我需要像http://www.starplugins.com/thumbelina這樣的縮放功能，你可以看到我需要使用自定義CSS的效果和jQuery。 – Mitul

即時通訊尋找你，但這是一個插件..你可以窺視代碼並使用一些想法。但要確保你是否複製了原來的信用點 – santinobonora

使用jQuery CSS的圖像縮放功能

回答

相關問題