Hey guys
I need help with a drop down menu I created.
I want it to reveal other sub-menus once the user clicks on it, instead of hovering with the mouse.
Is that possible?
Here is my code:
HTML
CSSCode:<html> <head> <link rel="stylesheet" type="text/css" href="menu.css"> </head> <body> <div id="menu"> <ul> <li><a href=""><p>Start</p></a> <div class="submenu"> <ul> <li><a href=""><p>Images </p></a></li> <li><a href=""><p>Videos</p></a></li> <li><a href=""><p>Documents</p></a></li> <li><a href=""><p>Settings</p></a></li> <li><a href=""><p>Log off</p></a></li> </ul> </li> </ul> </div> </div> </body> </html>
Code:body{background-color:grey;} #menu li{width:200px; float:left;list-style-type:none; position:relative; top:530px; left:-47px;} #menu a{ border-radius:15px; display:block; color:white; text-indent:55px; border:1px solid white; background-color:black; font-size:18pt; font-weight:bold; text-decoration:none;} #menu a:hover{color:black; background: white;} /*secondary foundation*/ #menu ul .submenu li{height:75px; float:left; width:250px;} #menu li .submenu{position:absolute; left:20px; top:-907px; width:10px; height:200px; display:none;} /*main foundation*/ #menu li:hover .submenu{display:block; float:left; height:200px; }
Reply With Quote
Bookmarks