提升变焦不起作用

我使用带有Apple风格的幻灯片库的高程缩放，一切正常。 但是，缩放function会放大隐藏的图像，这些图像会被滑块隐藏，直到它们在缩略图上单击时变得可见。 启动缩放插件的原始代码是

$("#zoom_01").elevateZoom(); 

我从其他问题中获得了以下JavaScript代码，它似乎可以解决问题，但它会在hover时激活图像并在不hover时禁用它。 我想要的是让缩放仅显示在可见图像上而不是隐藏图像上。 有人可以帮帮我吗？

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  jQuery( function () { var elevate_zoom_attached = false, $zoom_01 = $("#zoom_01") ; $zoom_01.hover( // hover IN function () { if ( ! elevate_zoom_attached ) { $zoom_01.elevateZoom({ cursor : "crosshair" }); elevate_zoom_attached = true ; }; }, // hover OUT function () { if ( elevate_zoom_attached) { // no need for hover any more $zoom_01.off("hover"); } } ); }) ; jQuery( function () { var elevate_zoom_attached = false, $zoom_02 = $("#zoom_02") ; $zoom_02.hover( // hover IN function () { if ( ! elevate_zoom_attached ) { $zoom_02.elevateZoom({ cursor : "crosshair" }); elevate_zoom_attached = true ; }; }, // hover OUT function () { if ( elevate_zoom_attached) { // no need for hover any more $zoom_02.off("hover"); } } ); }) ;  

Answer 1

我认为你没有设置elevateZoom来使用它提供的图库function。

而不是像你一样编写脚本，为什么不将选项作为变量传递？

 jQuery("#zoom_1").elevateZoom({ //the feature image gallery: 'menu', //it will seek out the images in the div#menu cursor: 'crosshair' }); 

请记住在每个缩略图上标记data-zoom-image="" ，并指向较大图像的链接。

有关更多信息，请访问Elevate Zoom网站： http ： //www.elevateweb.co.uk/image-zoom/examples