移动HTML页面的HTML幻灯片菜单？

Question

我想为移动html页面制作幻灯片菜单。

是否还有jquery库能够做到这一点？我怎么能自己做？

屏幕左上角应该有一个菜单按钮。

如果点击菜单按钮，内容应向右滑动，菜单栏将显示在左侧。

Answer 1

请参阅此页面以获取详细信息

http://www.berriart.com/sidr/

https://github.com/donwalter/jquery-mobile-slide-menu

包括以下文件：

<link rel="stylesheet" href="css/jquery-mobile-slide-menu.css" type="text/css" />
<script type="text/javascript" src="js/jquery-mobile-slide-menu.js"></script>

然后在标记前插入菜单：

<div id="side-menu">
    <ul>
        <li><a href="/">Main</a><span class="icon"></span></li>
        <li><a href="/page-2/">Page 2</a><span class="icon"></span></li>
        <li><a href="/page-3/">Page 3</a><span class="icon"></span></li>
        <li><a href="/page-4/">Page 4</a><span class="icon"></span></li>
    </ul>
</div>

然后添加此项以启动菜单：

$(function(){
    $('#side-menu').slideMenu();
});

DEMO