Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Drop down menu additional question (mouse click instead of rollover) on javascript

Posted on 2009-05-14
1
Medium Priority
?
230 Views
Last Modified: 2013-12-25
How do I create a vertical drop down menu where if you can click the mouse on one menu to see the sub menu which stays still there until you click the head menu again to hide the submenu?
0
Comment
Question by:blee246
1 Comment
 
LVL 12

Accepted Solution

by:
Chad Haney earned 1500 total points
ID: 24392293
Utilize javascript to change the views of your menu items utilizing the style="display:none" and "block".  See example code for reference of how to set this up.
//Scripts relating to examples
//
function change1(){
if(document.getElementById("1Nav").style.display=="block"){
    document.getElementById("1Nav").style.display="none";
}else{
document.getElementById("1Nav").style.display="block"; 
}
document.getElementById("2Nav").style.display="none";
}
function change2(){
 
if(document.getElementById("2Nav").style.display=="block"){
    document.getElementById("2Nav").style.display="none";
}else{
document.getElementById("2Nav").style.display="block"; 
}
document.getElementById("1Nav").style.display="none"; 
}
////////////////////////////////////////////////////
////////////////////////Example Code////////////////
<tr> 
	<td align="center" id="theNav">
		<ul class="mainNav">
			<li id="btnSpacer"> </li>
			<li id="btn1" onclick="change1()">1</li>
			<li id="btnSpacer"> | </li>
			<li id="btn2" onclick="change2()">2</li>
			<li id="btnSpacer"> </li>
		</ul>
		<ul class="subNav">
			<ul id="1Nav" style="display: none">
				<li><!--menu options--></li>
			</ul>
			<ul id="2Nav" style="display: none">
				<li><!--menu options--></li>
			</ul>
		</ul>	
	</td>
</tr>

Open in new window

0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
Strategic internal linking is often considered an SEO power technique, especially for content marketing. Do you need to hire an SEO agency to optimize you internal linking? No, this article will help you understand the basics of internal linking and…
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

572 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question