0

我的页面中有一个列表,我希望列表可以滚动,只有列表没有页面的所有其余部分...我使用iScrolljs 文件

这是我的代码:

<div id="ds">
            <div id="rtrt">
    <ul data-role="listview" id="a1"                
<li>
<a href="#">1</a>
</li>
<li>
<a href="#">2</a>
</li>
<li>
<a href="#">3</a>
</li>
.
.
.
.
         </ul>
            </div>
</div>

<script type="text/javascript">
 var myScroll;
        function loaded() {
                myScroll = new iScroll('rtrt');
            }

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);
</script>

但是滚动是在所有窗口上的列表上,所以我在整个屏幕上滚动,我怎样才能只滚动屏幕中间的列表(在移动设备中)。

有任何想法吗?

4

2 回答 2

0

使用 CSS 可以达到相同的结果:(300 px 的高度只是一个例子,让 div 尽可能高):

.rtrt{
height: 300px;
overflow: scroll
}
于 2012-11-27T09:05:30.733 回答
0

您只能使用 html/css 并且没有 javascript 也可以正常工作 您必须制作两个部分 第一部分固定在此放置您不想滚动的内容,然后在第二部分放置您需要的内容滚动它应该是这样的

<style type="text/css">
#first-section {
    height:100px;
    position:fixed;
    top:0;
    left:0;
    right:0;
}
#second-section{
    position:absolute;
    top:100px;
    left:0;
    right:0;
    bottom:0;
    overflow:auto;
}
</style>
<div id="first-section"><!--put fixed content here--></div>
<div id="second-section"><!--put scrollable content here--></div>
于 2012-11-27T10:06:04.943 回答