在網站開發中，實現放大鏡效果是很常見的需求。利用jQuery可以很方便地實現此功能，下面通過示例來展示實現放大鏡比例的方法。

// HTML結構
<div class="img-box">
<img src="大圖地址" data-img="中圖地址" alt="圖片">
<div id="zoom" style="width: 200px; height: 200px; display: none;"></div>
</div>
// CSS樣式
.img-box { position: relative; }
#zoom { position: absolute; top:0; left: 100%; border: 1px solid #ccc; overflow: hidden; }
// jQuery代碼
var zoom = $("#zoom");
var img = zoom.prev();
zoom.width(img.width() / 放大比例);
zoom.height(img.height() / 放大比例);
img.hover(function() {
zoom.show();
}, function() {
zoom.hide();
}).mousemove(function(e) {
var left = e.pageX - zoom.width() / 2 - img.offset().left;
var top = e.pageY - zoom.height() / 2 - img.offset().top;
if (left< 0) {
left = 0;
} else if (left >img.width() - zoom.width()) {
left = img.width() - zoom.width();
}
if (top< 0) {
top = 0;
} else if (top >img.height() - zoom.height()) {
top = img.height() - zoom.height();
}
zoom.css({ left: left, top: top });
var rateX = left / (img.width() - zoom.width());
var rateY = top / (img.height() - zoom.height());
var bigImg = zoom.next();
bigImg.css({
left: -(bigImg.width() - zoom.width()) * rateX,
top: -(bigImg.height() - zoom.height()) * rateY
})
});

上述代碼中使用了data-img屬性存儲中圖地址，當鼠標移到圖片上時展示放大鏡，并利用mousemove事件實現放大鏡跟隨鼠標移動的效果。同時，根據放大鏡在中圖上的位置計算出對應的大圖顯示部分。

最后，通過CSS樣式實現放大鏡和大圖的樣式，通過修改放大鏡的尺寸實現放大比例。