turn.js 怎么改变触摸区域大小


var point = flipMethods._c.call(this, corner, data.opts.cornerSize/1);

改变 这个数字的大小会改变右下角折起的大小默认的是2 数字越大折起的角越小

          x: point.x,
          y: point.y

这两个参数改变的是折起的角度

改变这里的 rgba( ) 颜色 会改变折角和翻页是背面的颜色

        $("#flipbook").turn({
            display:'single',  //显示单页
            autoCenter: true,
            acceleration:true,
            when: {
                turned: function(event, page, view) {
                    console.log("12323")
                    $(this).turn('peel','br');  //每个可翻页 右下角折起
                    }
                },
            page:2,//初始页面
        });

 

  

        $("#flipbook").bind("turning", function(event, page, view) {
          if (page==1) {        //当前页是第一页是执行函数    
            $("#flipbook").turn("direction", "ltr");  //向右翻页动作
            setTimeout(jump,500);  //延迟执行返回上一个页面 可以让用户看到翻页动画
          }
        });

     function jump(){  //返回上一个页面
            window.location.href = "javascript:history.back();"
        }

   $('.classs').click(function(){
            $("#flipbook").turn("next");   //点击某 class 翻一页

    $("#flipbook").turn("page",7);  //点击 翻到对应的页 如反倒第7页
        });

  //   如果转跳页面是会闪出上一个页面 最好先隐藏  第一页等加载完了 再显示  每一页的主class设置 position: absolute;top: 0;left: 0;

        $(document).ready(function(){
            $('.index111').css('display','block');
        });

  

  turn.js 怎么改变触摸区域大小  

  

  这个截图是 设置每个角的活动区域的大小  就是触摸范围大小  我是设置了活动范围 然后固定死右下角折起大小 就实现了想要的效果

  这个数值越大折角就会越大 我是设置了每页自动右下角折起 所以我把折角固定死 72 ,

  

 

  

  从右往左翻   /数字越小      触发翻页的范围越小    范围是你手机的宽度 / 1(自定义数字)  比如宽度是375px  则是(0,375)

  从左往右翻  /数字越大  触发翻页的范围越小    范围是你手机的宽度 / 10(自定义数字)     比如宽度是375px  则是(0,37.5)  

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM