简单的JavaScript下拉列表

时间:2017-02-24 21:26:08

标签: javascript jquery html css

我正在尝试从菜单按钮(实际上不是按钮)创建一个简单的下拉菜单。我知道我之前已经完成了这项工作并参考了我之前完成的项目并且完全相同但它仍然无法正常工作。任何帮助,将不胜感激!我在 HTML 主管中引用了最新的 jQuery UI

HTML

<header>
    <div id='logo_container'>
        <img src='img/rinTin_logo_white.png' id='header_logo' alt='RinTin Logo' />
    </div>
    <div id='menu_button_container'>
        <a href='#' id='menu_button_link'><img src='img/menu_button.png' id='menu_button' alt='' /></a>
    </div>
    <div class='clear'></div>
    <div id='mobile_nav_container'>
        <nav id='mobile_nav'>
            <ul id="primary_mobile">
                <li><a href='#'>Schedule</a></li>
                <li><a href='#'>Users</a></li>
                <li><a href='#'>Shifts</a></li>
                <li><a href='#'>System</a></li>
                <li><a href='#'>Forums</a></li>
            </ul>
            <ul id="secondary_mobile">
                <li><a href='#'>My Account</a></li>
                <li><a href='#'>Help</a></li>
                <li><a href='#'>Log Out</a></li>
            </ul>
        </nav>
    </div>
</header>

CSS

#mobile_nav_container{
    display:none;
}'

JS

$(document).ready(function() {
    $('#mobile_nav_container').removeClass('hidden');
});

$().ready(function(){
    $('#menu_button_link').click(function(){
        $('#mobile_nav_container').show('slow');
    });
});

0 个答案:

没有答案