我试过取消绑定并重新绑定 jqzoom,如下所示:
$('.jqzoom').unbind();
$('.jqzoom').jqzoom(options);
但是什么都没发生。任何人都可以帮助我如何做到这一点?
链接: http: //www.mind-projects.it/projects/jqzoom/
我试过取消绑定并重新绑定 jqzoom,如下所示:
$('.jqzoom').unbind();
$('.jqzoom').jqzoom(options);
但是什么都没发生。任何人都可以帮助我如何做到这一点?
链接: http: //www.mind-projects.it/projects/jqzoom/
尝试
$.jqzoom.disable('.jqzoom')
接着
$.jqzoom.enable('.jqzoom')
正如jquery.jqzoom-core.js
文件的解压缩源代码中所建议的那样,行686
jQzoom 没有办法做到这一点,但这没关系,因为你总是可以自己做到这一点。
与任何其他 jQuery 插件一样,该过程是相同的。所有 jquery 插件基本上都做同样的事情。首先,他们将一些数据与元素相关联。假设您有这样的图像。
<a class="zoom_link"><img id="product_thumb_image" src="...link to image..." /></a>
并且您也有小图像,您可以单击并更改大图像。例如,您有产品的大图像和同一产品的其他一些不同角度的小图像。这些是小图像。
<div id="small_images">
<a href="javascript:void(0)" rel="{gallery:'gal402', smallimage:'i1.jpg', largeimage:'l1.jpg'}">
<img src="i1.jpg" />
</a>
<a href="javascript:void(0)" rel="{gallery:'gal402', smallimage:'i2.jpg', largeimage:'l2.jpg'}">
<img src="i2.jpg" />
</a>
</div>
既然你这样调用 jqzoom
jQuery('.zoom_link').jqzoom({'preloadImages':true, zoomType: 'innerzoom' });
然后你需要像这样删除数据:
jQuery('.zoom_link').removeData('jqzoom')
但这还不够,因为您仍然有绑定到需要删除的元素的事件侦听器,否则您将无法在同一元素上重新启用 jqzoom。以下是您的操作方法 (不带参数的 unbind() 会删除所有事件侦听器。)
jQuery('.zoom_link').unbind();
/* These are the elements that jqzoom created */
jQuery('.zoomPad').unbind();
jQuery('.zoomPup').unbind();
/* For small images */
jQuery('#small_images').find('img').unbind();
jQuery('#small_images').find('a').unbind();
最后,我们需要通过在其中添加一些其他元素来恢复 jqzoom 更改的原始元素内容。
i = jQuery('.product_thumb_image').clone();
jQuery('.zoom_link').html( i.prop('outerHTML') );
上面的代码所做的是克隆里面的图像,并用我们调用 jqzoom 之前的图像替换“ zoom_link ”元素的全部内容。在此之后,您可以再次调用 jqzoom 并且它将起作用。
jQuery('.zoom_link').jqzoom({'preloadImages':true, zoomType: 'innerzoom' });
$('.jqzoom').removeData('jqzoom');
为我工作。
removeData
如果您在使用或disable
禁用 jqzoom时遇到问题,您可以试试这个:
$('.jqzoom').data('jqzoom').disable();
事实上,在 jquery.jqzoom-core.js 的第 686 行下,你会发现这两个方法:
disable: function (el) {
var api = $(el).data('jqzoom');
api.disable();
return false;
},
enable: function (el) {
var api = $(el).data('jqzoom');
api.enable();
return false;
},
希望对您有所帮助!