• bootstrap 上下页滚动


      

    <!DOCTYPE html>
    <html>
    <head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="js/jquery-1.11.0.min.js"></script>
    <script src="js/jquery.touchSwipe.min.js"></script>
    <style>
    #screen1{
    background-color: #ddd;
    display: block;
    position: absolute;
    100%;
    height: 100%;
    }
    #screen2{
    display: none;
    position: absolute;
    background-color: pink;
    100%;
    height: 100%;
    }
    #screen3{
    display: none;
    position: absolute;
    background-color: #00f;
    100%;
    height: 100%;
    }
    </style>
    </head>
    <body id="orientation">
    <div class="screen1" id="screen1" >

    </div>
    <div class="screen2" id="screen2">

    </div>
    <div class="screen3" id="screen3" >

    </div>
    <script>
    $(function () {
    function switcher(id, nextid, xiaid) {
    $(id).swipe({
    swipe: function (event, direction, distance, duration, fingerCount) {
    if (direction == "up") {
    $(nextid).show();
    $(this).hide();
    }
    else if (direction == "down") {
    $(xiaid).show();
    $(this).hide();
    }
    }
    }
    );
    }
    $("#screen1").swipe({
    swipe: function (event, direction, distance, duration, fingerCount) {
    if (direction == "up") {
    $("#screen2").show();
    $("#screen1").hide();
    }
    }
    }
    )
    switcher("#screen2", "#screen3", "#screen1");
    $("#screen3").swipe({
    swipe: function (event, direction, distance, duration, fingerCount) {
    if (direction == "down") {
    $("#screen3").hide();
    $("#screen2").show();
    }
    }
    }
    );
    });
    </script>
    </body>
    </html>
    <script>
    var c = "http://oss.tunji99.com/tunji-dev/20191107/14d11fa494a947539606aa9b94ddf818.png!q_max3,http://oss.tunji99.com/tunji-dev/20191107/14d11fa494a947539606aa9b94ddf818.png!q_max3,";
    var e = c.search("http://oss.tunji99.com/tunji-dev/20191107/14d11fa494a947539606aa9b94ddf818.png!q_max3,","");
    console.log(e);
    </script>
  • 相关阅读:
    js -- use strict
    css布局—— 固定+自适应
    web前端安全问题(转载)
    清除float浮动
    源码核心动画01-CALayer-基本使用(了解)
    源码0308-画板
    源码0306-手势解锁
    源码0301-图片水印-裁剪-截屏-截取-擦除
    源码0309-雪花(定时器)-图形上下文状态栈-矩阵操作
    源码0308-模仿UIImageView
  • 原文地址:https://www.cnblogs.com/shangjun6/p/11846256.html
Copyright © 2020-2023  润新知