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下载

JQuery 移动端 上下 滑动 切换 插件 pageSlider的更多相关文章

  1. FlexSlider jQuery滑动切换插件 参数

    demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...

  2. FlexSlider是一个非常出色的jQuery滑动切换插件

    FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看 ...

  3. jQuery 写的幻灯左右切换插件

    <html> <head> <meta charset="utf-8"> <title>官网</title> <s ...

  4. jquery全屏图片滑动切换

    在线演示 本地下载

  5. 基于jQuery左右滑动切换图片代码

    分享一款基于jQuery左右滑动切换图片代码.这是一款基于jQuery实现的左右滑动切换焦点图代码.效果图如下: 在线预览   源码下载 实现的代码: <div class="v_ou ...

  6. jQuery banner切换插件

    今天学写了一个基于jQuery焦点图切换插件,有不对的地方还请多多指教,不多说下面是代码: 1.引jQuery库 <script src="http://code.jquery.com ...

  7. 移动端tab滑动和上下拉刷新加载

    移动端tab滑动和上下拉刷新加载 查看demo(请在移动端模式下查看) 查看代码 开发该插件的初衷是,在做一个项目时发现现在实现移动端tab滑动的插件大多基于swiper,swiper的功能太强大而我 ...

  8. 移动端触摸滑动插件Swiper

    移动端触摸滑动插件Swiper 04/02/2015 一.了解Swiper 目前移动端项目一般都需要具有触屏焦点图的效果,如果你也需要实现这一功能的话,Swiper是一个不错的选择. 1.他不需要加载 ...

  9. 移动端网站的内容触摸滑动-Swiper插件

    手机平板等大多移动端站点都会有触摸滑动内容的功能,公司移动端站点(m.muzhiwan.com)的标题广告滑动以及轮播效果就是用的Swiper插件. Swiper就是常用于移动端网站的内容触摸滑动的一 ...

随机推荐

  1. Codeforces C. Almost Equal (数学规律)

    题目链接:http://codeforces.com/contest/1206/problem/C 题解 : 观察可以发现当n为偶数时,1 - 2n是不满足题意的,可以举例n = 2,n = 4试一试 ...

  2. Redis01——Redis介绍

    1.NoSQL数据库概述 NoSQL(NoSQL = Not Only SQL ),意即“不仅仅是SQL”,泛指非关系型的数据库. NoSQL 不依赖业务逻辑方式存储,而以简单的key-value模式 ...

  3. sql server2008用ip远程连接

    sql server2008用ip远程连接 转载 weixin_34167819 发布于2017-09-14 15:23:00 阅读数 84 收藏 展开 1,2005的外围应用配置器在2008中换了地 ...

  4. springboot 整合GuavaCache缓存

    Guava Cache是一种本地缓存机制,之所以叫本地缓存,是因为它不会把缓存数据放到外部文件或者其他服务器上,而是存放到了应用内存中. Guava Cache的优点是:简单.强大.轻量级. Guav ...

  5. mybatis重新回顾

    此次在项目中相遇了mybatis,重新回顾下. 1.resulMap解决了结果集的列名字跟实体setter和getter不匹配的问题 其中property是实体的setter和getter对象,col ...

  6. samba对外开放的端口

    前言搭建samba的时候,如果是在内网\测试环境中,可以直接关闭防火墙,但是如果是在外网情况下,需要对防火墙开放某些端口.开放的具体步骤,下面我们来看. 操作步骤1.添加端口 firewall-cmd ...

  7. 洛谷 P1494 [国家集训队]小Z的袜子（莫队）

    题目链接:https://www.luogu.com.cn/problem/P1494 一道很经典的莫队模板题,然而每道莫队题的大体轮廓都差不多. 首先莫队是一种基于分块的算法,它的显著特点就是: 能 ...

  8. app内区域截图利用html2Canvals保存到手机 截屏 (html2Canvals2版本1.0.0)

    html2canvas($(], {scale:,logging:false,useCORS:true}).then(function(canvas) { var dataUrl = canvas.t ...

  9. python闯关之路二（模块的应用）

    1.有如下字符串:n = "路飞学城"(编程题) - 将字符串转换成utf-8的字符编码的字节,再将转换的字节重新转换为utf-8的字符编码的字符串 - 将字符串转换成gbk的字符 ...

  10. Dart语言学习(二) Dart的常量和变量

    1.使用var声明变量,可赋予不同类型的值 Dart是一个强大的脚本类语言,可以不预先定义变量类型 ,自动会类型推导 Dart中定义变量可以通过var关键字可以通过类型来申明变量 var str='t ...