dimanche 22 mars 2015

add zoom on hover to woocommerce quickview popup image with JS


I have been trying to add a zoom on hover to an image displayed in a woocommerce quickview popup, here is what I have.


I am using this zoom plugin jacklmoore.com/zoom/


The image I want to have zoom is this (html front end and js function):





jQuery(document).ready(function($) {
$(document).ready(function(){
$('.rsSlide').zoom();
});
});



<div class="rsSlide "><img src="image.jpg"></div>


I have included this: http://ift.tt/1EAvKzn


I tried to include the above script and the function in multiple places including the quick view plugin, header, WP enqueue script, footer etc.


This should be working and it does If I recreate the setup in a page I.E: copy the html from the front end in to a new page and use the same javascript setup.


I think it has something to do with the way the image is pulled in prehaps ? it seems to mostly be done in javascript, Im not very proficient in js and there in lies my problem.


Here is the file for reference (see rsSlide assigned here): http://ift.tt/1EAvHDI


the only thing I can think is that the zoom would need to be added to the existing js to make it work, I have no idea at this point, Been trying to get this to wok for some time now with no luck.


Thank you for taking the time to read, I hope someone can help me fix this.





Aucun commentaire:

Enregistrer un commentaire