Question

我按照官方mmenu教程，但我无法正常工作。菜单不会出现。

我的html文件内容：

<!DOCTYPE html>
<html>
        <head>
        <title>Mmenu demo</title>
        <script src="/static/js/jquery-1.11.0.min.js" type="text/javascript"></script>
        <script src="/static/js/jquery.mmenu.min.js" type="text/javascript"></script>
        <link href="/static/css/jquery.mmenu.css" type="text/css" rel="stylesheet"/>
        <link href="/static/css/mmenu-demo.css" type="text/css" rel="stylesheet"/>
        <script src="/static/js/mmenu-demo.js" type="text/javascript"></script> 
        </head>

    <body>
        <div id="wrapper>
            <div id="content" class="content">
                <div id="box" class="box">
                <div id="title" class="title">mmenu demo</div>
                <div id="desc" class="desc">A menu should appear on the left</div>
            </div>
        </div>
        <nav id="menu">
            <ul>
                <li><a href="/">News</a></li>
                <li><a href="/">Projects</a></li>
                <li><a href="/">Street views</a></li>
                <li><a href="/">Contact</a></li>
                <li><a href="/">Shootings</a></li>
            </ul>
        </nav>
    </body>
</html>

我的自定义javascript文件 mmenu-demo.js

$(document).ready(function() {
    $("#menu").mmenu();
});

我的自定义css文件 mmenu-demo.css （仅用于运行演示）

.content{   
    padding:1em;
    text-align:center;
}

.box{
    border:1px solid lightgrey;
    width:30%;
}

.title{
    font-size:2.5em;
    font-family:"arial";
    color:white;    
    padding:1em;
    background-color:black;
}

.desc{
    font-family:arial;
    font-size:1em;
    color:white;
    padding:1em;
    font-weight:bold;
    margin-top:30%;
    background:rgba(0,0,0,0.5);
}

感谢您的帮助。

Answer 1

你只是错过了一个引用。

此：

<div id="wrapper>

应该是这样的：

<div id="wrapper">

另外，正如Emmanuel Brunet所说：

$("#menu").mmenu();

应该是：

$("#menu").trigger("open");

MMENU根本不起作用

1 个答案: