Question

我使用BookFlip v4和Dynamic Drive Power Zoomer来完成一个项目。基本上它是一个具有翻转放大功能的在线杂志。

我正确配置了所有内容，DDPZ将放大第一页，但在我翻到下一页后，它会消失，如果我通过导航按钮返回主页面，它将不会显示。我怀疑它按下按钮后没有加载脚本。帮助

<script type="text/javascript">

jQuery(document).ready(function($){ //fire on DOM ready


//EXAMPLE 1:
//$('#myimage').addpowerzoom()

//EXAMPLE 2:
$('#bookflip img').addpowerzoom({
    defaultpower: 2,
    powerrange: [2,7],
    largeimage: null,
    magnifiersize: [200,200] //<--no comma following last option!
})

})


</script>

下面是我定位的图片：

<div id="bookflip">
</div>

 </div>
<div id="pages" style="width:1px;height:1px;overflow:hidden;">
    <div style="background-color:white;"></div>


    <div name="Front"><img src="images/KWC-Raya1.jpg" /></div>

    <div><img src="images/KWC-Raya2.jpg" /></div>
    <div><img src="images/KWC-Raya3.jpg" /></div>
    <div><img src="images/KWC-Raya4.jpg" /></div>
    <div><img src="images/KWC-Raya5.jpg"></div>
    <div><img src="images/KWC-Raya6.jpg"></div>
    <div><img src="images/KWC-Raya7.jpg"></div>
    <div><img src="images/KWC-Raya8.jpg"></div>
    <div><img src="images/KWC-Raya9.jpg"></div>
    <div><img src="images/KWC-Raya10.jpg"></div>
    <div><img src="images/KWC-Raya11.jpg"></div>
    <div><img src="images/KWC-Raya12.jpg"></div>
    <div><img src="images/KWC-Raya13.jpg"></div>
    <div><img src="images/KWC-Raya14.jpg"></div>
    <div><img src="images/KWC-Raya15.jpg"></div>
    <div><img src="images/KWC-Raya16.jpg"></div>
    <div><img src="images/KWC-Raya17.jpg"></div>
    <div><img src="images/KWC-Raya18.jpg"></div>
    <div><img src="images/KWC-Raya19.jpg"></div>
    <div><img src="images/KWC-Raya20.jpg"></div>
    <div><img src="images/KWC-Raya21.jpg"></div>
</div>

Answer 1

函数mytest（）仅应用于第一个图像/页面，我认为它应该在所有页面上：

<div><img onclick="myTest()">...</div>

也是

行

$('#bookflip img').addpowerzoom({ ...

应用于文档就绪的空div（id：bookflip）。

<div id="bookflip">
</div>

试试这个：

$(document).ready(function() {
  $('#pages img').addpowerzoom();
});

或者我们可以等待bookflip构建其元素并在窗口加载时应用powerzoom：

$(window).load(function() { 
  $('#bookflip img').addpowerzoom(); 
});

Jquery放大镜在单击下一个图像后消失

1 个答案: