头像

html5+turn.js模拟合同电子书翻页代码

来源:js/3820.html 素材火管理员 2018-07-20 12:11浏览(566) 收藏

html5+turn.js模拟合同电子书翻页代码,以前发布过一些书本翻页效果基本都是图片形式的,这个是文字形式的哦。
html5+turn.js模拟合同电子书翻页代码
分类:html5 难易:中级

程序员,你不是一个人;网站开发QQ群:698377651,在线充值,或联系QQ3401083589直接充值

查看演示 下载资源: 20

手机扫码访问:

下载资源 下载积分: 20 积分

js代码

<script type="text/javascript" src="basic/extras/jquery.min.1.7.js"></script>
    <script type="text/javascript" src="basic/extras/modernizr.2.5.3.min.js"></script>
    <script type="text/javascript">
        function loadApp() {
            $('.flipbook').turn({
                width: 914,
                height: 643,
                elevation: 500,
                gradients: true,
                autoCenter: true

            });
        }
        yepnope({
            test: Modernizr.csstransforms,
            yep: ['basic/lib/turn.js'],
            nope: ['basic/lib/turn.html4.min.js'],
            both: ['basic/css/basic.css'],
            complete: loadApp
        });

        $(".prev-btn").on("click", function (event) {
            $(".flipbook").turn("previous");
        });
        //上一页按钮
        $(".next-btn").on("click", function (event) {
            $(".flipbook").turn("next");
        });

        $('.seal').on('click', function () {
            var str = '可以自定义公司名称'; //假设公司名称
            var letter = str.split('');
            var o = 7 - Math.floor(letter.length / 2);
            $(this).parent().siblings('.box').children('span').html();
            for (var i = 0; i < letter.length; i++) {
                $(this).parent().siblings('.box').children('span').eq(o + i).html(letter[i]);
            }
            $(this).hide().siblings('.qx-seal').show().parent().siblings('.box').show();
        })
        
        $('.qx-seal').on('click', function () {
            $(this).hide().siblings('.seal').show().parent().siblings('.box').hide();
        })

        $('.disabled').find('input').attr('disabled', 'disabled');
        $('.disabled').find('.seal').attr('disabled', 'disabled');
    </script>
最新交易
评论7
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 3401083589

  • 头像 6楼
    08-09 08:26
    ap***ce
    真棒,正需要这效果
  • 头像 5楼
    07-22 09:49
    心***扬
    效果超级棒,正是需要的,感谢分享……
  • 头像 4楼
    07-22 09:46
    x-***in
    太棒了 谢谢老板的
  • 头像 3楼
    07-22 09:42
    u *** ゜
    效果可以,感谢分享。
  • 头像 板凳
    07-21 10:09
    宝***志
    这个有点特别 哈哈不错
  • 头像 椅子
    07-21 08:19
    en***37
    强大的特效啊啊。。。不错
  • 头像 沙发
    07-20 16:17
    li***ng
    东西真的太好了 赞
1 2
博聚网