![](/img/trans.png)
[英]How to apply zoom effect on mouseover for all the images passed in a single Image tag using jquery?
[英]Jquery Image Zoom for All Images
我在网上( http://www.elevateweb.co.uk/image-zoom )上找到了一个jquery图像缩放插件,但是我想应用此插件有200多个小图像。 我想我需要在elevatezoom.js上跟踪鼠标,我该怎么做?
HTML
<img id="zoom_01" src="image1.png" data-zoom-image="image1.jpg"/>
脚本
<script> $("#zoom_01").elevateZoom(); </script>
(elevatezoom.js文件可在http://www.elevateweb.co.uk/download-file上找到 )
尝试这样的事情:
首先,提供一个.class
来处理所有图像
<img class="image-to-zoom"
id="zoom_01" src="image1.png" data-zoom-image="image1.jpg"/>
然后,附着到.class
的mouseover
事件来触发elevateZoom()
的元件上具有鼠标悬停
$('.image-to-zoom').on('mouseover',function(){
//This element is being 'mouseovered', so trigger the plugin
$(this).elevateZoom();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.