0

我使用 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>
4

1 回答 1

0

功能 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(); 
});
于 2013-07-17T08:12:11.853 回答