如何使用Mootools创建下拉列表？

Question

我想在我的表单中添加下拉列表（按钮的onclick事件）。 我知道这是JS的基础。 但请帮忙！ 在此先感谢！

Answer 1

有一个很好的例子here，包括所有必要的HTML，Javascript和CSS。

HTML：

<div id="menu-container">
<ul id="drop_down_menu">
    <li class="menu">Menu 1
        <ul class="links">
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
        </ul>
    </li>
    <li class="menu">Menu 2
        <ul class="links">
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
            <li><a href="#">Link 3</a></li>
        </ul>
    </li>
</ul>

Javascript：

window.addEvent('domready', function(){
$('drop_down_menu').getElements('li.menu').each( function( elem ){
    var list = elem.getElement('ul.links');
    var myFx = new Fx.Slide(list).hide();
    elem.addEvents({
        'mouseenter' : function(){
            myFx.cancel();
            myFx.slideIn();
        },
        'mouseleave' : function(){
            myFx.cancel();
            myFx.slideOut();
        }
    });
})
});