turn.js实现翻书效果

所属分类:媒体,其他-图片展示,动画效果

 202571  641  查看评论 (91)
分享到微信朋友圈
X
turn.js实现翻书效果 ie兼容7

turn.js实现翻书效果

完美自适应屏幕大小

支持ie7以上浏览器

可键盘翻页、鼠标点击按钮翻页,鼠标卷边翻页,可放大缩小书页

相关插件-图片展示,动画效果

JQUERY全屏撕裂幻灯片-FULLSCREEN-SLIT-SLIDER

fullscreen-slit-slider由 jQuery 和 css3 打造而成。为我们提供了一个全屏的撕裂效果的幻灯片,接下来我就为大家讲解以下相关的用法。
  图片展示
 45123  421

焦点效果

类似于百叶窗的效果
  图片展示
 35157  362

360度全景展示效果

按下鼠标左键拖拽360度全景展示效果
  图片展示
 37887  435

14种炫酷堆叠卡片切换动画特效

14种炫酷堆叠卡片切换动画特效
  图片展示
 49417  515

讨论这个项目(91)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    皇朝E族 0
    2023/9/21 12:27:37
    现在只有卷边出来才能点击翻页,请问怎样能直接点击翻页 回复
    wanghahaha 0
    2023/9/17 17:11:16
    大佬,怎么使pages动态获取图片
        wanghahaha0
        2023/9/20 16:06:27
        好使,稍微改了下,但还是没看懂所有代码
        爱哭dē小魔女0
        2023/10/12 16:33:41
        怎么做动态获取图片
    回复
    儿子他爸 0
    2023/3/22 11:53:38
    能在翻页后,的下一页里添加按钮链接或注册登录功能吗? 回复
    ?迷??? 0
    2021/11/25 17:16:50
    手机端能否默认设置横版 回复
    ?迷??? 0
    2021/11/25 17:14:30
    手机端打开太小了,手机端页面打开能自动放大到一定的比率吗 回复
    糖糖的 0
    2021/9/6 15:04:49

    如何不显示第一页封面

    turn.js中_eventStart修改为:
     _eventStart: function(e) {
       var data = this.data().f,
         turn = data.opts.turn;  
         
       if (!data.corner && !data.disabled && !this.flip('isTurning') &&
         data.opts.page==turn.data().pagePlace[data.opts.page])
       {  
         data.corner = flipMethods._isIArea.call(this, e);
    
         if(data.corner.corner=='bl' && data.opts.page<=2){
           data.corner = null;
           return false;
         }
    
         if (data.corner && flipMethods._foldingPage.call(this)) {
           this.trigger('pressed', [data.point]);
           flipMethods._showFoldedPage.call(this, data.corner);
    
           return false;
    
         } else
           data.corner = null;
    
       }
    
     },
    回复
    浅浅相遇,安陪一生。 0
    2020/12/21 14:22:34
    请问一下有谁知道怎么取消点击页角翻页吗?
    回复
    浅浅相遇,安陪一生。 0
    2020/12/16 15:14:32
    请问谁知道怎么取消页角卷起时点击翻页效果,内容我添加了点击弹窗会同时触发翻页效果,点击内容出现弹窗不翻页,谢谢 回复
    小丫头 0
    2020/11/19 19:53:43
    可以实现自动翻页吗 回复
    mahayu2011 0
    2020/10/12 15:29:51
    可以实现每页高度不一样吗 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复