jQuery mobile向页面添加了额外的滚动条

时间:2013-08-20 13:25:50

标签: jquery html5 mobile scrollbar

我目前正在使用jQuery mobile(第一次)。 我的一个页面包含很长的文本。如果我在桌面浏览器上查看此页面,jquery将向页面添加滚动条(除了浏览器之外)。 如何删除第二个滚动条?

<html>
<head>
<title>Header</title>
<meta name="viewport" id="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
...
</head>
<body>
<div id="infoPage" data-role="page" data-add-back-btn="true">

    <div data-role="header" data-position="fixed" data-theme="a" data-fullscreen="false" id="detailsHeader">
        <a href="../index.html" rel="external" data-icon="back" class="ui-btn-left">Back</a>
        <h1>Information</h1>
        <a href="javascript:history.go(0)" data-icon="refresh" data-iconpos="right" class="ui-btn-right">Refresh</a>
    </div>

    <div data-role="content" data-theme="a">

        <div data-role="collapsible" data-collapsed="false">
            <h1>Information</h1>

            <table  data-role="table" data-mode="reflow">
              ....
            </table>
        </div>

       <div data-role="content">
           <pre>...large text goes here....</pre>
        </div>

    </div>

    <div data-role="footer" data-position="fixed" data-theme="a" data-fullscreen="false" id="detailsFooter">
        <div data-role="navbar">
          <ul>
            <li><a href="#overview" rel="external" data-role="button" data-icon="info" data-iconpos="top">Status</a></li>
            <li><a href="#" data-role="button" data-icon="grid" data-iconpos="top" class="ui-btn-active ui-state-persist">Info</a></li>
          </ul>
        </div>
    </div>
</div>

抱歉......我完全忘记了代码。

1 个答案:

答案 0 :(得分:0)

当我使用面板时,我有一个双滚动条。我不得不从这里切换我的CSS引用:

<link rel="stylesheet" href="jquery.mobile.structure-1.3.2.css">
<link rel="stylesheet" href="jquery.mobile.theme-1.3.2.css">

到此:

<link rel="stylesheet" href="jquery.mobile-1.3.2.css">

否则尝试从页面中删除每个div并逐个添加它们,直到看到哪个div导致第二个滚动条。