javascript - 使用 jQuery CSS 的图像缩放功能

Question

我已经创建了脚本，可以在单击事件时动态更改产品图像，但是当鼠标在大图像上移动时，我需要在大图像上添加缩放功能。

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

Answer 1

onfocus -> 动画到新的高度和宽度，

这是您想要达到的目标吗？我无法给出更好的答案，因为这个问题对我来说有点不清楚。如果你想要更好的答案，请为我扩展你的问题