我的jquery移动页面不断滚动页脚

时间:2014-09-16 04:20:03

标签: jquery

https://gist.github.com/alkapwn3d/39b4e9ad677f4963682f#file-index-html

http://codepen.io/alkapwn3d/pen/Ikxzm

<html></html>

加载页面并查看。如果你看一下它滚过页脚。

我真的需要阻止这一点。有什么建议吗?

1 个答案:

答案 0 :(得分:1)

你必须有一些HTML错误。我取出了所有其他页面并添加了一个,错误消失了。我建议将您的应用程序分解为多个html文件,并使用文档中描述的ajax方法加载它们。

<html xmlns="http://www.w3.org/1999/html">
<head lang="en">
<meta charset="UTF-8">
<title>Edliz 2011 Sample</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">

<style>

</style>

</head>

<body>

<!--Main page-->
<div id="mainpage" data-role="page">

<!--Title of site-->
<header data-role="header">
    <p style="text-align:center; font-family: cambria"> EDLIZ 2011 - 6th Edition</p>
</header>

<!--Main page & table of content-->
    <article data-role="content" data-theme="d">
        <ul data-role="listview" data-filter="true">
            <li>
                <a href="#section1">
                    <h1>1. Guidelines on Antimicrobial Treatment an Prophylaxis</h1>
                </a>
            </li>
            <li>
                <a href="#section2">
                    <h1>2. Basic Infection Prevention and Control Measures</h1>
                </a>
            </li>
            <li>
                <a href="#section3">
                    <h1>3. Paediatric Conditions</h1>
                </a>
            </li>
            <li>
                <a href="#section4"><h1>4. Immunisation</h1>
                </a>
            </li>
            <li><a href="#section5"><h1>5. Obstretric and Gynaecological Conditions</h1></a></li>
            <li><a href="#section6"><h1>6. Sexually Transmitted Infections</h1></a></li>
            <li><a href="#section7"><h1>7. HIV Related Disease</h1></a></li>
            <li><a href="#section8"><h1>8. Antiretroviral Theory</h1></a></li>
            <li><a href="#section9"><h1>9. Use of ARVS for the Prevention of Mother-to-child Transmission of HIV (PMTCT)</h1></a></li>
            <li><a href="#section10"><h1>10. Tuberculosis</h1></a></li>
            <li><a href="#section11"><h1>11. Tropical Diseases</h1></a></li>
            <li><a href="#section12"><h1>12. Malaria</h1></a></li>
            <li><a href="#section13"><h1>13. Respiratory Conditions</h1></a></li>
            <li><a href="#section14"><h1>14. Cardiovascular Disease</h1></a></li>
            <li><a href="#section15"><h1>15. Gastrointestinal Conditions</h1></a></li>
            <li><a href="#section16"><h1>16. Renal Tract Conditions</h1></a></li>
            <li><a href="#section17"><h1>17. Rheumatological and Joint Conditions</h1></a></li>
            <li><a href="#section18"><h1>18. Metabolic and Endocrine Conditions</h1></a></li>
            <li><a href="#section19"><h1>19. Neurological Conditions</h1></a></li>

        </ul>
    </article>

<footer data-role="footer" data-position="fixed" >
    <nav data-role="navbar">
        <ul>
            <li><a href="#info" data-icon="info">Info</a></li>
        </ul>
    </nav>
</footer>
</div>
<!--end page-->
<div id="sec4" data-theme="d" >

<header data-role="header">
    <p style="text-align:center; font-family: cambria"> EDLIZ 2011 - 6th Edition</p>
</header>

<article data-role="content">
    <p>testing</p>
</article>

<footer data-role="footer" data-position="fixed" >
    <nav data-role="navbar">
        <ul>
            <li><a href="#mainpage" data-icon="home">Home</a></li>
        </ul>
    </nav>
</footer>

</div>
</body>
</html>

http://codepen.io/gad2103/pen/geGor