<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

    <title>Title</title>

    <style>

        html,body{width: 100%;height: 100%;overflow:hidden}

        *{ margin: 0;padding: 0 }

        #main{width: 100%;height: 100%;position: relative;}

        #box{width: 700%;height: 100%;position: absolute;  top:0;left: 0;background: yellowgreen}

    </style>

</head>

<body>

<div id="main">

    <div id="box">

        <span>1111111111111111111111111111111111111111</span>

        <span>2222222222222222222222222222222222222222</span>

        <span>3333333333333333333333333333333333333</span>

        <span>44444444444444444444444444444444</span>

        <span>555555555555555555555555555</span>

        <span>666666666666666666666666</span>

        <span>6777777777777777777777777777777</span>

    </div>

</div>

</body>

<script src="iscroll.js"></script>

<script>

    var myScroll;

    function loaded() {

        myScroll = new iScroll('main',{

            bounce:false,//是否超过实际位置反弹

            momentum:true,//是否拖动惯性

            hScrollbar:false,//是否显示水平滚动条

        });

    }

    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

    document.addEventListener('DOMContentLoaded', loaded, false);

</script>

</html>

iscroll的滑动效果的更多相关文章

  1. iphone 在设置了initial-scale=1 之后，在设置滚动条之后，没有滑动效果的解决办法

    iphone在设置了initial-scale=1 之后,我们终于可以以1:1 的比例进行页面设计了. 关于viewport,还有一个很重要的概念是:iphone 的safari 浏览器完全没有滚动条 ...

  2. a 锚点跳转滑动效果

    点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...

  3. Android Scroll分析——滑动效果产生

    相对于在Android2.x版本上出现的长按.点击事件的效果,不得不说,滑动操作具有更好的用户体验.因此,从Android 4.X版本开始,出现了更多滑动操作的效果.越来越多第三方应用模仿这样的效果, ...

  4. jquery左右滑动效果的实现

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. bootstrap实现 手机端滑动效果，滑动到下一页，jgestures.js插件

    bootstrap能否实现 手机端滑动效果,滑动到下一页 jgestures.js插件可以解决,只需要引入一个JS文件<script src="js/jgestures.min.js& ...

  6. Android实现多页左右滑动效果，支持子view动态创建和cache

    要实现多页滑动效果,主要是需要处理onTouchEvent和onInterceptTouchEvent,要处理好touch事件的子控件和父控件的传递问题. 滚动控制可以利用android的Scroll ...

  7. 【Android 界面效果27】利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果

    本文主要介绍如何利用ViewPager.Fragment.PagerTabStrip实现多页面滑动效果.即google play首页.新浪微博消息(at.评论.私信.广播)页面的效果.ViewPage ...

  8. 十六、Android 滑动效果汇总

    Android 滑动效果入门篇(一)—— ViewFlipper Android 滑动效果入门篇(二)—— Gallery Android 滑动效果基础篇(三)—— Gallery仿图像集浏览 And ...

  9. Android 滑动效果进阶篇（六）—— 倒影效果

    上篇介绍了使用Animation实现3D动画旋转翻页效果,现在介绍图片倒影实现,先看效果图 本示例主要通过自定义Gallery和ImageAdapter(继承自BaseAdapter)实现 1.倒影绘 ...

随机推荐

  1. java开发系列-服务器tomcat

    概述 tomcat是Apache组织提供的,中小型的免费的支持Servlet和JSP规范的服务器. tomcat安装配置 下载 官方下载地址 下载,绿色版直接解压到指定目录就好. 启动Tomcat 双 ...

  2. thinkphp3.2.3 nginx 连接mysql 报错 new PDO 异常

    在 php.ini 里重新指定mysql.sock 路径 pdo_mysql.default_socket=/Applications/XAMPP/xamppfiles/var/mysql/mysql ...

  3. springboot2.0 使用aop实现PageHelper分页

    参考: https://blog.csdn.net/qq_24076135/article/details/85212081 https://www.jianshu.com/p/036d31ae77d ...

  4. rsyslog 服务器重启后 发现不能接受到外部日志 只能接受本地日志 关闭防火墙即可

    rsyslog 服务器重启后 发现不能接受到外部日志 只能接受本地日志  关闭防火墙即可 1 关闭防火墙: # systemctl stop firewalld 2 将SELINUX设置为disabl ...

  5. ThinkPHP实现了ActiveRecords模式的ORM模型

    ThinkPHP实现了ActiveRecords模式的ORM模型,采用了非标准的ORM模型:表映射到类,记录映射到对象.最大的特点就是使用方便和便于理解(因为采用了对象化),提供了开发的最佳体验,从而 ...

  6. P1985 [USACO07OPEN]翻转棋

    题目链接: 翻转棋 题目分析: 先状压/\(dfs\)枚举第一排状态,然后在每个\(1\)下面翻,即确定了第一排就确定了后面的状态 最后验证一下最后一排是不是全0即可 代码: #include< ...

  7. PAT甲级——【牛客练习题100】

    题目描述 Given N rational numbers in the form "numerator/denominator", you are supposed to cal ...

  8. Spring SpringMVC SpringBoot SpringCloud 注解整理大全

    Spring SpringMVC SpringBoot SpringCloud 注解整理 才开的博客所以放了一篇以前整理的文档,如果有需要添加修改的地方欢迎指正,我会修改的φ(๑˃∀˂๑)♪ Spri ...

  9. java调js基础

    public static void main(String[] args)throws Exception { ScriptEngine se = new ScriptEngineManager() ...

  10. 如何解决mysql服务器load高

    .登录主机 # ssh hostname .确定是否是mysql导致 # top .查看是哪些sql正在慢查询 # mysql -h hostname -P port -u username # sh ...