jquery - jqzoomのバインドを解除して再バインドするにはどうすればよいですか？

Question

以下に示すように、jqzoomのバインド解除と再バインドを試しました。

$('.jqzoom').unbind(); 

$('.jqzoom').jqzoom(options);

しかし、何も起こりませんでした。これを行う方法を教えてもらえますか？

リンク： http： //www.mind-projects.it/projects/jqzoom/

Answer 1

試してみてください

$.jqzoom.disable('.jqzoom')

その後

$.jqzoom.enable('.jqzoom')

jquery.jqzoom-core.jsファイルの解凍されたソースコード内で提案されているように、行686

Answer 2

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') );

上記のコードが行うことは、内部の画像を複製し、「zoom_link」要素の内容全体を、jqzoom を呼び出す前の画像に置き換えることです。この後、jqzoom を再度呼び出すと、機能します。

jQuery('.zoom_link').jqzoom({'preloadImages':true, zoomType: 'innerzoom' });  

Answer 3

$('.jqzoom').removeData('jqzoom');

私のために働いた。