0

我的移动网站有以下代码:

<div data-role="page" id="home">

    <div data-role="header">
        <h1>home</h1>
    </div><!-- /header -->

    <div data-role="content">   
        <p>some text</p>


    </div><!-- /content -->

<div data-role="footer" data-position="fixed"> 
    <div data-role="navbar"> 
        <ul>  
        <li><a href="#home" data-iconpos="right" data-icon="star" data-transition="slide">home</a></li> 
        <li><a href="#contact" data-iconpos="right" data-icon="info" data-transition="slide">contact</a></li> 

        </ul> 
    </div> 
</div> 

</div><!-- /page home -->

现在我想要一个 2 行导航栏:

第一行带有显示/隐藏导航栏的按钮,第二行带有导航栏,只有当我单击该按钮时才会显示。

我的问题是我在 jquerymobile 中找不到该导航栏的显示/隐藏按钮之类的东西。所以我希望有人有其他解决方案。

谢谢你

4

1 回答 1

0

查看 jquery .toggle 函数,下面是一些我拼凑但未经测试的代码,它所做的只是在单击按钮时使用 jquery 切换函数来显示/隐藏 id=navbar 的 html 元素。你必须用css自己定位按钮和导航栏......

<a id="showHideNav" onclick="$.("#navbar").toggle();" data-role="button">Show/Hide Nav</a>

    <div id="navbar" data-role="navbar"> 
        <ul>  
        <li><a href="#home" data-iconpos="right" data-icon="star" data-transition="slide">home</a></li> 
        <li><a href="#contact" data-iconpos="right" data-icon="info" data-transition="slide">contact</a></li> 

        </ul> 
    </div> 
</div>
于 2012-11-13T09:25:47.813 回答