如何制作下拉菜单

Question

CSS

.nav {
    margin-top: 0px;
    margin-left: 0%;     
}
.nav ul {
    width: 100%;
    height: auto;
    background-color: #fff;
    margin-bottom: 0px;
    margin-top: 0px;
    display: absolute;
    z-index: 2;
    /*top: -124px;*/
    position: fixed;
    border-bottom: 2px #009759 solid;
}
.nav ul li {
    margin-top: 5px;
    color: white;
    list-style-type: none;
    display: inline;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 20px;
    padding-bottom: 22px;

    border-radius: 0px;
}
.nav ul li a
{
    color: #009759;
    text-decoration:none;
}
.nav ul li active {
    color: #ff0000;
}

从我的一个标题菜单按钮制作下拉菜单的最佳方法是什么？我包含了我的CSS文件标题，但现在我需要你告诉我如何下拉。

Answer 1

您可以通过多种方式制作下拉菜单。通常的方法是制作能够处理所选菜单上的悬停事件的javascript代码。

网上有很多很好的教程可以帮助你......比如dropdown with javascript

但如果您正在寻找纯css下拉菜单，您还可以查看以下链接：dropdown pure css

Answer 2

你可以使用Jquery。我以前做过这个，虽然代码看起来有些粗糙，但它的工作非常好。

$(".nav ul, .nav ul li, .nav ul li a").hide();
$(".nav").hover(function(){
   $(".nav ul, .nav ul li, .nav ul li a").show(500);
});