插件描述：jQuery触摸手机全屏上下滑动滚屏特效
全屏经典上下滚动插件
js部分修改自动获取div最大值
<script type="text/javascript">
$(document).ready(
function () {
var speed = 800;//图片滑动速度
var maxpage = $('.container .page').size() - 1;
var nowpage = 0;
//给最大的盒子增加事件监听
$(".container").swipe(
{
swipe: function (event, direction, distance, duration, fingerCount) {
if (direction == "up") {
nowpage = nowpage + 1;
} else if (direction == "down") {
nowpage = nowpage - 1;
}
if (nowpage > maxpage) {
nowpage = maxpage;
alert("已经到最后一张了");
}
if (nowpage < 0) {
nowpage = 0;
alert("这是第一张");
}
$(".container").animate({"top": nowpage * -100 + "%"}, speed);
}
}
);
}
);
</script>
PREVIOUS:
NEXT:
相关插件-布局,滚动
讨论这个项目（19）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约
莫问 0
2018/7/17 9:56:50
-
这个不好，苹果不兼容，滑动不流畅。
莫问1
2018/7/17 10:04:45
经测试，苹果手机加以下代码好像可以，IPAD上测试OK了。
//禁用手机默认的触屏滚动行为
document.addEventListener('touchmove', function(event) {
event.preventDefault();
}, false);
寻芳而至0
2019/2/16 19:25:42
-
你确定吗？
ζ?????? 长欢” 0
2017/5/7 17:00:20
不兼容苹果手机
青柠0
2017/8/14 11:36:22
怎么解决兼容问题
十半先生0
2017/11/2 11:46:28
-
同问
忆灵 0
2015/3/24 9:28:26
-
能不能贴上没有压缩过的代码？
colblack0
2015/11/30 17:11:04
用编辑器格式化代码
尘小小0
2016/12/30 15:12:28
-
怎么格式化，用什么格式化代码？
liyanan0
2017/1/21 22:13:13
用sublime格式化
西瓜0
2017/1/21 23:25:59
js格式化工具，格式化一下即可
http://www.jq22.com/jsgsh
😃
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
😃
取消回复
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
