jQuery Image Zoom是一款非常實用的圖片放大工具，可以讓用戶輕松地在網頁上放大圖片。它使用JavaScript和jQuery庫，能夠自適應不同大小的圖像，并提供了平滑的放大效果。

$(document).ready(function() {
$('.zoom').hover(function() {
$(this).addClass('transition');
}, function() {
$(this).removeClass('transition');
}).mousemove(function(e) {
var noZoom = $(this).find('img').width()<= $(this).width() || $(this).find('img').height()<= $(this).height();
if(!noZoom) {
var x = e.pageX - $(this).offset().left;
var y = e.pageY - $(this).offset().top;
var bgPosX = (x / $(this).width()) * 100;
var bgPosY = (y / $(this).height()) * 100;
$(this).find('img').css('transform', 'translate(-50%, -50%) scale(2)').css('transform-origin', bgPosX + '% ' + bgPosY + '%');
}
});
});

上述代碼實現了鼠標懸停在圖片上時觸發放大效果的功能。首先，通過jQuery選擇器選中需要放大的圖片元素。在鼠標懸停時，添加具有過渡效果的CSS類名，使放大效果更加平滑。然后，使用mousemove事件獲取鼠標在圖片中的位置，并計算出放大后的圖片位置。最后，使用CSS轉換函數scale來實現放大效果，并設置CSS屬性transform-origin來使放大效果在鼠標指針位置開始。

總之，jQuery Image Zoom提供了一種簡單而強大的方式來放大圖像，使用戶更容易地查看細節。此外，它還可自定義樣式以滿足不同的設計需求。