zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    B树、B-树、B+树、B*树
    CentOS 7 源码编译安装PostgreSQL 9.5
    phpstorm里面无法配置deployment?
    Php7安装pdo_pgsql,pgsql扩展
    [xDebug] PhpStorm Xdebug远程调试环境搭建
    [xDebug]Xdebug和Sublime调试PHP代码
    [xDebug] 服务器端的配置参数
    [xDebug] php下的Debug的调试
    【转】漫画:什么是协程?
    【转】一个由正则表达式引发的血案----贪婪模式的回溯
  • 原文地址:https://www.cnblogs.com/shangjun6/p/11846256.html
Copyright © 2011-2022 走看看