zoukankan      html  css  js  c++  java
  • JQuery 移动端 上下 滑动 切换 插件 pageSlider

    HTML
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
        <meta content="telephone=no" name="format-detection" />
        <meta name="description" content="" />
        <meta name="keywords" content="" />
        <title>demo - pageSlider</title>
        <link href="../../Script/plugins/pageSlider1.0/pageSlider.css" rel="stylesheet" />
    </head>
    <body>
        <div class="section sec1" style="background-color:#FFCCCC;">1 移动端中向下滑动<div class="to-form-link"><a href="http://www.baidu.com">我是链接</a></div></div>
        <div class="section sec2" style="background-color:#4ACBF7;">2</div>
        <div class="section sec3" style="background-color:#63E339;">3</div>
        <div class="section sec4" style="background-color:#F7D34A;">4</div>
        <div class="section sec5" style="background-color:#FF8ECE;">5</div>
        <div class="section sec6" style="background-color:#ACDCED;">6</div>
    
    
        <script src="../../Script/plugins/pageSlider1.0/zepto-1.1.4.js"></script>
        <script src="../../Script/plugins/pageSlider1.0/pageSlider1.0.js"></script>
        <script>
            var pageSlider = PageSlider.case();
    
            //a标签无法触发跳转的问题用以下代码
            $(".to-form-link>a").on('touchend', function () {
                location.replace($(this).attr("href"));
            });
        </script>
    </body>
    </html>

    pageSlider1.0下载

  • 相关阅读:
    MSSQL Join的使用
    MSSQL2008 常用sql语句
    Process使用
    c# 多线程 调用带参数函数
    C# 多线程参数传递
    C# 单例模式代码
    C#调用存储过程
    页面布局
    构建:vue项目配置后端接口服务信息
    浏览器工作原理(二):浏览器渲染过程概述
  • 原文地址:https://www.cnblogs.com/kikyoqiang/p/11956181.html
Copyright © 2011-2022 走看看