jQuery的 - 摧毀和點擊

我用我的網站下面的變焦插件初始化插件：http://www.elevateweb.co.uk/image-zoom jQuery的 - 摧毀和點擊

它的工作原理採用了mouseenter和鼠標離開事件。我試圖通過點擊來完成這項工作。單擊以放大並取消縮放（？），並在mouseleave上取消縮放。

點擊初始化與下面的代碼一起工作，但我想添加銷燬或停止第二次點擊或mouseleave功能或甚至點擊一個新的幻燈片。（它在旋轉木馬滑塊內）有沒有人有任何想法？

jQuery('span.zoom img').bind('click',function(){ 
    jQuery("span.zoom img").elevateZoom({ 
     zoomType: "inner", 
     cursor: "crosshair", 
     responsive: true, 
     scrollZoom: true 
    }); 
});

編輯：我已經報廢了上述情況並創建了我自己的縮放。這場運動現在給我帶來了麻煩。鏈接：http://bigideaadv.com/pic_site/?p=95

jQuery("div.zoom2 img.rsImg2").mousemove(function(e) { 
     var zoom = jQuery(this); 
     var position = zoom.position(); 

     //console.log(position); 

     jQuery(".rsImg2").css({"left" : position.left, "top" : position.top}); 

     // the first parameter (e) is automatically assigned an event object 

     //TODO: Uncomment 
     var parentOffset = jQuery(this).parent().offset(); 
     //or $(this).offset(); if you really just want the current element's offset 
     var relX = e.pageX - parentOffset.left; 
     var relY = e.pageY - parentOffset.top; 

     jQuery(".rsImg2").css({"left" : relX, "top" : relY}); 
    });

來源

2013-12-12 Dave Rottino

如果您通過點擊切換類，該怎麼辦？我沒有測試過，但值得一試。你需要像這樣遍歷每個圖像：

jQuery(document).ready(function() { 

jQuery('span.zoom img').each(function() { 
    var self = jQuery(this); 
    self.click(function() { 
     self.toggleClass('doZoom');  
    }); 
}); 

jQuery('.doZoom').elevateZoom({ 
    zoomType: "inner", 
    cursor: "crosshair", 
    responsive: true, 
    scrollZoom: true 
}); 

});

來源

2013-12-12 19:20:51 Tomanow

因此，下面你的代碼snippit，我已經知道它在哪裏初始化點擊。我必須在每個函數內的另一個函數調用中添加.elevateZoom函數，以檢查「span.zoom img」是否具有doZoom類。現在我需要一種方法來銷燬點擊時的elevateZoom實例。這很容易嗎？ –

點擊縮放後再次點擊會發生什麼？ – Tomanow

我不是100％確定的，因爲我最終做出了自己的縮放。對於x2大小的相同圖像，這是一個簡單的交換。我將代碼添加到了鼠標移動中的圖像上。此舉無法按預期進行。我也包含了一個鏈接。有什麼想法嗎？ –

jQuery的 - 摧毀和點擊

回答

相關問題