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. Javaweb项目的命名规范

    项目名称:一般是英文 包名:公司域名的倒写,例如com.baidu 数据访问层:dao,persist,mapper 实体:entity,model,bean,javabean,pojo 业务逻辑:s ...

  2. Springboot中定时任务的使用

    在springboot中已经集成了定时任务,只需要在启动类上加注解@EnableScheduling即可 例如: 添加类加上@Component注解,添加方法加上@Scheduler即可

  3. C语言报错：“gets”: 找不到标识符。解决方法

    C语言报错:“gets”: 找不到标识符. 把“gets”改成“gets_s”即可.

  4. Visual Studio 2017进行Python开发环境的搭建，使用VS2017进行python代码的编写。

    Visual Studio 2017进行Python开发环境的搭建,使用VS2017进行python代码的编写. 前提:已经安装过VS2017且进行过配置. 第一部分: Python环境的搭建: 建议 ...

  5. laravel执行数据库迁移的过程中出现Illuminate\Database\QueryException : SQLSTATE[HY000] [2002] Operation timed out (SQL: select * from information_schema.tables where table_schema = shop and table_name = migrations

    向customers表添加字段phone php artisan make:migration add_phone_to_customers_table 问题: 解决方法: 将DB_HOST配置项修改 ...

  6. python 中对list去重

    本文去重的前提是要保证顺序不变,本文给出了多种实现方法,需要的朋友可以参考下 1.直观方法 最简单的思路就是: ids = [1,2,3,3,4,2,3,4,5,6,1] news_ids = [] ...

  7. Springmvc-crud-04错误（路径变量）

    错误: 原因:接收不到restful风格请求的参数(id值),需要添加路径变量注解 @RequestMapping(value="/book/{id}",method=Reques ...

  8. AT24C02芯片学习记录

    1.首先看AT24C02芯片的引脚说明 2.芯片的型号与存储容量(bit)的对应关系: 3.总线时序 我对时序的理解: 时钟线分两种:一种是外部时钟源控制时钟线低电平持续多久高电平持续多久,就像串口: ...

  9. mysql测试点

    前言 性能测试过程中,数据库相关指标的监控是不可忽视的,在这里我们就MySQL的监控配置及重点涉及性能的一些参数进行说明. 在笔者的日常性能测试过程中,重点关注了这些参数,但不代表仅仅只有这些参数对性 ...

  10. 反编译 java

    1.winrar https://www.rarlab.com/ 2.github  jd-gui http://java-decompiler.github.io/ SignNatureTest.j ...