如何更改数据缩放图像值
我正在使用提升缩放效果来缩放图像，我的图像标记是：
和elevatezoom脚本是：
$("#zoom_01").elevateZoom({scrollZoom : true});
我有很多想要缩放的图像，同样的id，src值正在改变，但是我无法改变数据缩放图像的值。如何更改数据缩放图像值，你也可以访问任何[e coomerce website我想说的是什么。 1
更改数据缩放图像属性后，您需要使用elevateZoom重新初始化，如下所示：
$("#zoom_01").data('zoom-image', 'newURL').elevateZoom({ responsive: true, zoomType: "lens", containLensZoom: true });
如果您想要显示缩放的更改图像，只需执行此操作即可
$('.zoomWindowContainer div').stop().css("background-image","url("+ changed_image +")");
我想你需要这个……
$("#zoom_01").attr('data-zoom-image', 'new path');
我在这里遇到完全相同的问题，想通了：它可能不起作用，因为插件不支持更改该特定属性 – 它有自己的图库function。 他们自己的文档中有错误，这是它的工作原理：
主图像和缩略图的HTML：
用于初始化库的jQuery：
$("#bigpic").elevateZoom({ gallery:'gal1', galleryActiveClass: 'active'
- 加上你想要的任何其他属性
用于将图像传递到主容器的jQuery：
$("#bigpic").bind("click", function(e) { var ez = $('#bigpic').data('elevateZoom'); $.fancybox(ez.getGalleryList()); return false; });
我是jQuery的新手，我并不是真的100％理解这里的机制，但这就是我如何使它工作，我希望它适合你！
在js中包含以下代码，它可以解决您的问题在变量smallImage中给出新小图像的url，并在largeImage中给出新大图像的url。 希望这可以解决您的问题，而无需重新升级您的提升缩放。
var ez = $("#zoom_01").data("elevateZoom"); ez.swaptheimage(smallImage, largeImage);
您只需使用插件本身提供的库function，只需将图像包装到容器中即可
...
那么你必须像这样调用插件：
$("#zoom_x").elevateZoom({ gallery: "my_images", zoomType : "inner", cursor: "crosshair", imageCrossfade: true });
var zoomElement = $('#zoom_01'); // destroy old one zoomElement.removeData('zoom-image'); $('.zoomContainer').remove(); // set new one zoomElement.attr('data-zoom-image', image_large_size); zoomElement.attr('src', image_normal_size); // reinitial elevatezoom zoomElement.elevateZoom();