Question

我有一个页面，其中有一个固定页眉和固定页脚我在内容中有列表，我将动态数据附加到列表视图。

HTML

<div data-role="page">
    <div data-role="header" data-position="fixed">
        <h1> list header </list>
    </div>
    <div data-role="content" class="listscroll">
        <div id="list"></div>
    </div>
    <div data-role="footer" data-position="fixed">
        <h1> list footer </list>
    </div>
</div>

JS

var k = '<ul data-role="listview">';
for (i = 0; i < 5; i++) {
    k += '<li><div style="height:80%;"><a href="#quoteList_detailPage" data-role="none"><img src="http://www.jucoolimages.com/images/quotes/quotes_18.gif" width="100%"height="80px"></a></div></li>';
    k += '<div style="height:105px;text-shadow:none;" id="' + i + '">' +
        '<div style="height:80%;"><a href="#" data-role="none" data-transition="slide"><img src="http://www.jucoolimages.com/images/quotes/quotes_18.gif" width="100%"height="80px"></a>' +
        '</div></div>';
}
k += '</ul>';

$('#list').html(k);
$('#list ul').listview();

CSS

.listscroll {
    overflow-y: scroll;
    max-height: 336px;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

但加载的页面有两个垂直滚动条：内部滚动条略大于页面，外部滚动条是页面的长度。

如何删除外部滚动条？

感谢：）

Answer 1

你应该参考这个解决方案：

＆LT; Double scroll bars when using the Panels of jQuery Mobile 1.3 in ASP.NET MVC 4＆gt;

我相信这样的事情可以解决这个问题：

<link rel="stylesheet" href="themes/CUSTOM.min.css" />   
<link rel="stylesheet" href="jquery.mobile.structure-1.3.0.min.css"/>

jquery移动页面中的双垂直滚动条

1 个答案: