JQzoom-更改图像源后无法移动Zoom Picure [英] JQzoom - Zoom Picure not moveable after changing Image source

问题描述

我正在使用JQuery缩放网站上的图像.我还创建了一些图标，如果单击它，它将改变图像的缩放比例.不幸的是，在更改图像后，缩放后的图像不再可移动.我只能在缩放窗口中看到图像的顶部.但是当我向下移动鼠标时，什么也没有发生.有人知道，我做错了吗?

I'm using the JQuery to zoom images on my web site. I also created some Icons that will change the image to zoom if I click on it. 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. Does anyone know, what I did wrong?

这是我的Java脚本函数的源代码，可通过单击以下图标之一来调用它:

Here is my source code for the java script function that is called by clicking on one of the icons:

function changePicture(imgSrc)
{    
document.getElementById("main-image-js").setAttribute("src", imgSrc);
document.getElementById("main-image-zoom").setAttribute("href", imgSrc);
$(".zoomWrapperImage").children('img').eq(0).attr("src", imgSrc);   
}

要缩放的图像是这样实现的:

The Image to zoom is implemented like that:

<a class="main-image" href="Picture1.jpg" id="main-image-zoom" title="Zoom">
<img id="main-image-js" src="Picture1.jpg" width="380" style="display: inline; cursor: pointer;"></a>

感谢和问候.

推荐答案

更改图像源之前，应先清除jQZoom中的数据:

You should clean the data from jQZoom before changing image source:

function changePicture(imgSrc)
{ 
    cleanJqzoom();

    $("#main-image-zoom").attr('href', imgSrc);
    $("#main-image-js").attr('src', imgSrc);

    initJqzoom();
}

function initJqzoom() { 
    $('.main-image').jqzoom(); 
}   

function cleanJqzoom() {
    // clean the data from jQZoom
    $('.main-image').removeData('jqzoom');
}

这篇关于JQzoom-更改图像源后无法移动Zoom Picure的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！