Question

我正在使用一个flipbook库为cordova（ios）创建目录，并且我正在尝试为各个页面添加缩放功能。

出于某种原因，缩放仅适用于前6页/类。

以下小提琴不包含图像，似乎与remTemp功能有问题，但我向你保证它可以在浏览器和ios上运行。

HTML：

 <div id="zoomer"></div> 
   <div id="zoom-viewport">
    <div id="flipbook">

<div class="flippage"><img src="pages/cover.jpg"  class="small i1"></div>
<div class="flippage"><img src="pages/inner-cover.jpg"  class="small i0"></div>
<div class="flippage"><img src="pages/1.jpg"  class="small i1"></div>
<div class="flippage"><img src="pages/2.jpg"  class="small i2"></div>
<div class="flippage"><img src="pages/3.jpg"  class="small i3"></div>
<div class="flippage"><img src="pages/4.jpg"  class="small i4"></div>
<div class="flippage"><img src="pages/5.jpg"  class="small i5"></div>
<div class="flippage"><img src="pages/6.jpg"  class="small i6"></div>
<div class="flippage"><img src="pages/7.jpg"  class="small i7"></div>
<div class="flippage"><img src="pages/8.jpg"  class="small i8"></div>
<div class="flippage"><img src="pages/9.jpg"  class="small i9"></div>
<div class="flippage"><img src="pages/10.jpg"  class="small i10"></div>
</div></div></div>

使用Javascript：

$('.small').click(function() { 

    cls = $(this).attr("class");
    rem = 'small i';
    clas = cls.replace(rem,'');

    imagesrc = $(this).attr("src");

    if (clas % 2 == 0) {
    loc = "left";
    $('body').append("<img src='"+imagesrc+"' id='temp' onclick='remTemp();'class='temp small' style='position:absolute; left:12px; top:199px; z-index:5 !important;'>");

    }
    if (clas % 2 != 0) {
    loc = "right"
    $('body').append("<img src='"+imagesrc+"' id='temp' onclick='remTemp();'class='temp small' style='position:absolute; left:512px; top:199px; z-index:5 !important;'>");
    }




    $(this).css('z-index','-1');
    $('.temp').animate({ 
    top: 10,
    left: 10,
    width:1000,
    height: 707
    }, 1000
    );



    });

    function remTemp() {
    $('img').remove('#temp');
    }

我完全不知道为什么点击功能会在6页之后停止，我已经尝试删除前x页，无论我在哪里尝试它都是6（总共94页）

由于

*作为一个注释，我尝试过使用许多不同的选择器，但仍然遇到同样的问题。

JQuery - 单击处理前6个类的函数

0 个答案: