javascript - iscroll 滚动结束后的停留位置
本文介绍了javascript - iscroll 滚动结束后的停留位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<script src="iscroll.js" type="text/javascript" charset="utf-8"></script>
<style>
#wrapper{
position: absolute;
top: 0px;
bottom:0px;
overflow: hidden;
}
ul li{
width: 300px;
height: 30px;
line-height: 30px;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="scroller">
<ul>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
<li>倒数第二个</li>
<li>最末端</li>
</ul>
</div>
</div>
<script>
var myScroll = new IScroll('#wrapper', { mouseWheel: true,click:true });
</script>
</body>
</html>
最后一个li停留的位置始终不是在bottom:0的位置,这是为什么?
解决方案
body {
overflow: hidden;
}
#wrapper {
position: absolute;
top: 0px;
bottom: 0px;
}
#scroller{
position: absolute
}
ul li {
width: 300px;
height: 30px;
line-height: 30px;
}
样式改成这样。
这篇关于javascript - iscroll 滚动结束后的停留位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文