javascript - jquery如何让缩放变得平滑

Question

我正在使用 JQuery Zoom 作为图像查看器。单击图像时图像会缩放。 我想让变焦变得顺利。我该怎么做？

代码:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>
<script src='js/jquery.zoom.js'></script>
<script>
    $(document).ready(function(){    
        $('#ex4').zoom({ on:'toggle' });
    });
</script>

html

<div class="zoom" id="ex4">
    <img src="images/element.jpg"/>
</div>

Answer 1

您可以使用duration选项，这样缩放效果会花费更多时间并且看起来更平滑。

引用:

duration 120 The fadeIn/fadeOut speed of the large image.

代码:

$(document).ready(function () {
    $('#ex1').zoom({
        on: 'toggle',
        duration: 1000
    });
});

演示:http://jsfiddle.net/IrvinDominin/YDart/