简体   繁体   中英

jQZoom: innerzoom issue

I'm using the Jqzoom Plugin to zoom images on my web site.Unfortunately after the Image change, the zoomed image is not moveable anymore. I can only see the top of the image in the zoom window. But when I move the mouse down, nothing happens. here is my Productthumbimage COde:

ProductTinyImage Code:

one thing that i know is in my Rel attributes "smallimage": "%%GLOBAL_ProductThumbImageURL%%", "largeimage": "%%GLOBAL_ProductZoomImageURL%%" are empty, i don't now why..Does anyone know, what I did wrong?

Small and large image urls are empty

here is my head Script.

$(document).ready(function() {
    $('.jqzoom').jqzoom({
            zoomType: 'innerzoom',
            preloadImages: false,
            alwaysOn:false
        });
});


</script>

i downloaded the plugin from here "www.mind-projects.it"

here is my Product page URl: http://www.angeljackets.co.uk/products/Emma-Swan-Once-Upon-A-Time-Leather-Jacket.html

You probably need to rebind the plugin when you switch the image.

Inside showProductThumbImage in product.functions.js , add the jqZoom script at the bottom of the function.

function showProductThumbImage(ThumbIndex) {
    $('.ProductThumbImage img').attr('src', ThumbURLs[ThumbIndex]);
    $('.ProductThumbImage img').attr('alt', ProductImageDescriptions[ThumbIndex]);


    CurrentProdThumbImage = ThumbIndex;
    ShowVariationThumb = false;
    highlightProductTinyImage(ThumbIndex);
    if (ShowImageZoomer) {
        $('.ProductThumbImage a').attr("href", ZoomImageURLs[ThumbIndex]);
        $('.ProductThumbImage a').css({
            'cursor': 'pointer'
        });
    }

    $('.jqzoom').jqzoom({
        zoomType: 'innerzoom',
        preloadImages: false,
        alwaysOn: false
    });
}

If that works, you may want to look at unbinding jqZoom, and add that before you rebind it above. It's always a good idea to unbind stuff before you rebind it again. Here's a couple of links on the subject:

How can I unbind JQZOOM in my JQuery Script?

how can i unbind and rebind jqzoom

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM