加载页面时隐藏div,并在单击链接时显示(Hide div when the page is loaded and show when link is clicked)
我把这个简单的代码用于下拉菜单,它到目前为止工作。 问题是当我加载页面时,会显示#drop菜单,这显然不是我们想要的。 目标是在单击#submenu链接时显示#drop菜单,而不是立即显示.drop菜单。
我在下面修改了我的代码,因为我需要一个div元素,而不是一个列表。
JS
$(document).ready( function(){ $('#submenu').click( function(event){ event.stopPropagation(); $('#drop').toggle(); }); $(document).click( function(){ $('#drop').hide(); }); });HTML
<a href="#" id = "submenu">Products</a> <div id = "drop" > DROP DOWN MENU </div>I took this simple code for drop down menu and it's working so far. The problem is that when I load the page, #drop menu is displayed, which is obviously not what we want. The goal is to show the #drop menu when #submenu link is clicked, not immediately.
I modified my code below, because I need a div element, not a list.
js
$(document).ready( function(){ $('#submenu').click( function(event){ event.stopPropagation(); $('#drop').toggle(); }); $(document).click( function(){ $('#drop').hide(); }); });html
<a href="#" id = "submenu">Products</a> <div id = "drop" > DROP DOWN MENU </div>最满意答案
添加一些CSS:
#drop { display: none; }Add some css:
#drop { display: none; }更多推荐
发布评论