Javascript 如何制作下拉菜单

我在互联网上找到了这个下拉菜单。问题是，下拉菜单总是打开的，而且不起作用。当我从中粘贴所有默认代码时 它不工作。请你能帮助我。我如何才能使当用户点击按钮时，它显示下拉菜单，并一直等到用户再次点击按钮

我包括2个脚本

 <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
 <script src="assets/js/menu.js"></script>

/*菜单CSS------------*/
.顶{
背景色：#F8；
宽度：100%；
高度：60px；
-webkit盒阴影：嵌入0px-200px 8px-200px rgba（1781761,1）；
-moz盒阴影：嵌入0px-200px 8px-200px rgba（1781761）；
盒影：插入0px-200px 8px-200px rgba（1781761,1）；
}
.profile_img{
最大宽度：28px；
最大高度：32px；
边缘顶部：5px；
}
所容纳之物
{
位置：相对位置；
顶部：5px；
宽度：250px；
左边距：30px；
}
.user\u文本{
显示：内联块；
左边距：20px；
垂直对齐：20%；
字体系列：“开放式Sans”，无衬线；
字体大小：15px；
}
.管理小组
{
背景：#f8f8；
宽度：240px；
高度：40px；
颜色：#888；
边界：无；
边界半径：3px；
填充：0 10px；
字体：粗体13px Helvetica，无衬线；
文本转换：大写；
线高：41px；
游标：默认值；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
-o-用户选择：无；
用户选择：无；
边缘底部：7px；
盒影：0 1px 1px rgba（0,0,0,0.2）；
}
向下
{
位置：绝对位置；
排名：0；
右：0；
填充：10px 14px 0；
边界：无；
颜色：#888888；
字体大小：20px；
}
.down:悬停{color:#555555；}
.user_text{cursor:pointer；}
.菜单a
{
显示：块；
背景：#f8f8；
宽度：240px；
高度：40px；
填充：0 10px；
字体：粗体13px Helvetica，无衬线；
文本转换：大写；
文字装饰：无；
颜色：#000000；
颜色：rgba（0,0,0,0.4）；
线高：40px；
盒影：0 1px 1px rgba（0,0,0,0.2）；
字体系列：“开放式Sans”，无衬线；
字体大小：13px；
}
.菜单a:第n个子菜单（2）
{
边框左上半径：3px；
边框右上角半径：3px；
}
.菜单a：最后一个孩子
{
边框左下半径：3px；
边框右下半径：3px；
}
.menu a:悬停{color:#555555；}
.menu a:hover>.octicon{color:#555555；}
箭
{
宽度：0；
身高：0；
左边距：15px；
左边框：7px实心透明；
右边框：7px实心透明；
边框底部：9px实心#F8；
}

柯蒂斯·杰克逊

您在JQ中使用的

 $( ".cog, .admin-text" ).on( "click", function()
   {
    $( ".menu" ).stop().fadeToggle( "fast" );
   });

HTML中不存在

.cog

和

.admin文本。我猜您希望在单击
箭头后或在带有class.user\u text的文本上显示
菜单（fadeIn）

您还说，
.menu
总是出现，当然，如果您不隐藏它，就会出现这种情况。在本例中，我通过在CSS中设置
{display:none}
来隐藏它

请参阅下面的代码

如果这是你想要的，请告诉我


$（“.down，.user_text”）。单击（函数（）{
$（“.menu”）.fadeToggle（“快速”）；
})
.top{
背景色：#F8；
宽度：100%；
高度：60px；
-webkit盒阴影：嵌入0px-200px 8px-200px rgba（1781761,1）；
-moz盒阴影：嵌入0px-200px 8px-200px rgba（1781761）；
盒影：插入0px-200px 8px-200px rgba（1781761,1）；
}
.profile_img{
最大宽度：28px；
最大高度：32px；
边缘顶部：5px；
}
所容纳之物
{
位置：相对位置；
顶部：5px；
宽度：250px；
左边距：30px；
}
.user\u文本{
显示：内联块；
左边距：20px；
垂直对齐：20%；
字体系列：“开放式Sans”，无衬线；
字体大小：15px；
}
.管理小组
{
背景：#f8f8；
宽度：240px；
高度：40px；
颜色：#888；
边界：无；
边界半径：3px；
填充：0 10px；
字体：粗体13px Helvetica，无衬线；
文本转换：大写；
线高：41px；
游标：默认值；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
-o-用户选择：无；
用户选择：无；
边缘底部：7px；
盒影：0 1px 1px rgba（0,0,0,0.2）；
}
向下
{
位置：绝对位置；
排名：0；
右：0；
填充：10px 14px 0；
边界：无；
颜色：#888888；
字体大小：20px；
}
.down:悬停{color:#555555；}
.user_text{cursor:pointer；}
.菜单a
{
显示：块；
背景：#f8f8；
宽度：240px；
高度：40px；
填充：0 10px；
字体：粗体13px Helvetica，无衬线；
文本转换：大写；
文字装饰：无；
颜色：#000000；
颜色：rgba（0,0,0,0.4）；
线高：40px；
盒影：0 1px 1px rgba（0,0,0,0.2）；
字体系列：“开放式Sans”，无衬线；
字体大小：13px；
}
.菜单a:第n个子菜单（2）
{
边框左上半径：3px；
边框右上角半径：3px；
}
.菜单a：最后一个孩子
{
边框左下半径：3px；
边框右下半径：3px；
}
.menu a:悬停{color:#555555；}
.menu a:hover>.octicon{color:#555555；}
箭
{
宽度：0；
身高：0；
左边距：15px；
左边框：7px实心透明；
右边框：7px实心透明；
边框底部：9px实心#F8；
}
.菜单{显示：无}

柯蒂斯·杰克逊
.down
&
.user\u text

试试看：


$（.down，.user_text”）。在（“单击”，函数（）上{
$（“.menu”）.stop（）.fadeToggle（“快速”）；
});
/*菜单CSS------------*/
.顶{
背景色：#F8；
宽度：100%；
高度：60px；
-webkit盒阴影：嵌入0px-200px 8px-200px rgba（1781761,1）；
-moz盒阴影：插图0px-200
$( ".cog, .admin-text" ).on( "click", function()

$( ".admin-panel" ).on( "click", function()

.menu {display: none;}

$( ".cog, .admin-text" ).on( "click", function()

$( ".admin-panel" ).on( "click", function()