手机网页左右滑动效果或者上下滑动效果

 时间:2026-02-14 17:28:49

1、下载iScroll.js

百度搜索iScroll.js,或者从这里下载https://pan.baidu.com/s/1geEovGB

手机网页左右滑动效果或者上下滑动效果

2、引入iScroll.js

在你要使用滑动效果的地方,引入iScroll.js文件 

3、编写规范的html格式

只有如下格式才能实现滑动效果

<div id="wrapper">

    <div class="scroll">

       这个区域可以滑动

    </div>

</div>

如下格式不能滑动

<div id="wrapper">

       <div class="other">这个区域可以滑动</div>   

      <div class="scroll">

       这个区域不可以滑动了

        </div>

</div>

只有wrapper的第一个子元素才能实现滑动效果。

4、编写js调用代码

var Scroll = new iScroll('wrapper',{hScrollbar:false, vScrollbar:false});

第一参数必需是滑动元素的父元素的id。

主要参数一览:

hScroll: true, 左右滑动,默认为true

vScroll: true,上下滑动

hScrollbar: true, 是否显示y轴滚动条,默认为显示

vScrollbar: true,是否显示X轴滚动条,默认为显示

5、最终效果

手机网页左右滑动效果或者上下滑动效果

  • wps的transpose怎么用
  • C4D中如何在原模型上创建模型
  • 手提袋为什么在印刷要覆膜?
  • 怎样合并图层
  • Unity Xml教程 之 Xml文件的创建快速掌握
  • 热门搜索
    beyond歌曲大全 猪皮怎么做好吃 微信冻结了怎么解冻 pdf文件怎么修改 失眠了怎么办怎么尽快入睡 男孩名字大全 嘴唇干燥怎么办 酸辣椒的腌制方法 测量血压的正确方法 战争电视剧大全