JQzoom - 变焦Picure不可移动改变图片来源后(JQzoom - Zoom Picure

我使用jQuery来放大我的网站上的图像。 我也创造了一些图标，这将改变图像可放大，如果我点击它。 在图像变化之后不幸的是，放大的图像不能移动了。 我只能看到图像的顶部的缩放窗口。 但是，当我移动鼠标下来，什么都不会发生。 有谁知道，我做错了什么？

以下是一个可以通过点击图标一个叫Java脚本函数我的源代码：

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

将图像缩放实现这样的：

<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>

感谢和问候。

Answer 1:

改变图像源之前，您应该清理从jQZoom数据：

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 not moveable after changing Image source