Solved

How do I insert a java drop down menu

Posted on 2010-09-10
11
608 Views
Last Modified: 2013-11-23
I am trying to insert a java drop down menu into a web page.  I can do so with a regular menu by using

<!--#include virtual="menu.asp" -->

The problem is when I do this with with my java menu, as soon as you leave the main menu to try to navigate the sub menu it goes away.  Is there a way I can insert the menu so I can edit the menu in one single location when making changes to the menu both cosmetic and operational.
0
Comment
Question by:Pangeia
  • 6
  • 5
11 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33649541
Java or javaSCRIPT?

Normally with JS you just do
<script src="menu.js" type="text/javascript"></script>
0
 

Author Comment

by:Pangeia
ID: 33649919
Yes.  In the header.

Im talking about doing something like this.

defalut.asp

<html>

<head>
<script src="Menu/dbMenu.js" type="text/javascript"></script>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
</head>

<body>
<div align="left">
      <table border="0" width="600">
            <tr>
                  <td bgcolor="#B0F0F0">&nbsp;</td>
                  <td bgcolor="#000000">&nbsp;</td>
                  <td bgcolor="#B30000">&nbsp;</td>
            </tr>
      </table>
</div>
<!--#include virtual="menu.asp" -->
<div align="left">
      <table border="0" width="600">
            <tr>
                  <td bgcolor="#FFB409">&nbsp;</td>
                  <td bgcolor="#3F3362">&nbsp;</td>
                  <td bgcolor="#3FA490">&nbsp;</td>
            </tr>
      </table>
</div>

</body>

</html>

menu.asp

<html>
<head>
      <title>Dropdown menu Menu Test</title>
      <script src="Menu/dbMenu.js" type="text/javascript"></script>
      <link href="Menu/global.css" type="text/css" rel="stylesheet" media="screen">
      <link href="Menu/dropDown.css" type="text/css" rel="stylesheet" media="screen">
</head>
<body>

<ul id="menu" class="dbMenu onMouse">
      <li style="left: 0px; top: 0px; width: 4em">Home</li>
                  <li style=width:15em><a class="download" title="Initiates file download" target="_blank" href="displaycontent.pdf">
                  Drop down menu item</a></li>
</ul>

</body>
</html>
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33652209
That would not be a good idea.
the menu needs to not be an html document

So either

<ul id="menu" class="dbMenu onMouse">
      <li style="left: 0px; top: 0px; width: 4em">Home</li>
                   <li style=width:15em><a class="download"  title="Initiates file download" target="_blank"  href="displaycontent.pdf">
                  Drop down menu item</a></li>
</ul>

or the most

<script src="Menu/dbMenu.js" type="text/javascript"></script>
      <link href="Menu/global.css" type="text/css" rel="stylesheet" media="screen">
      <link href="Menu/dropDown.css" type="text/css" rel="stylesheet" media="screen">
<ul id="menu" class="dbMenu onMouse">
      <li style="left: 0px; top: 0px; width: 4em">Home</li>
                   <li style=width:15em><a class="download"  title="Initiates file download" target="_blank"  href="displaycontent.pdf">
                  Drop down menu item</a></li>
</ul>

but I would not include dbMenu in the parent then.
0
 

Author Comment

by:Pangeia
ID: 33662122
I have been instructed I have to make the menu centralized.  SO there is one place where I make all changes and they reflect on all pages.

With css I can do this with things like colors and sizes, but I need it to be so that if I rename a button, or change a link, I only have to do it once.

This is what I'm looking for.  From the way your solution looks it still has me having to go to every page and changing the link on each individual page.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33662404
No, you only ever edit menu.asp
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:Pangeia
ID: 33662804
OK.  I tried to do what I thought you said.  I feel I need to explain... I have limited experience in web design and do not know java, but have been tasked with getting this done.  STRESS

When I replaced the code on the menu page with...

<script src="Menu/dbMenu.js" type="text/javascript"></script>
     <link href="Menu/global.css" type="text/css" rel="stylesheet" media="screen">
     <link href="Menu/dropDown.css" type="text/css" rel="stylesheet" media="screen">
<ul id="menu" class="dbMenu onMouse">
     <li style="left: 0px; top: 0px; width: 4em">Home</li>
                  <li style=width:15em><a class="download"  title="Initiates file download" target="_blank"  href="displaycontent.pdf">
                 Drop down menu item</a></li>
</ul>

it no longer loads into the web page.  Was I wrong in my interpretation that I was to make it a blank page and paste this in there?  Was I supposed to have left some of the original code there?
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
ID: 33662953
I cannot say it is the nicest menu I have ever seen, but it sure looks standalone enough to me:

<script src="http://www.javascriptkit.com/script/script2/dbmenu/dbMenu.js" type="text/javascript">

	/***********************************************
	* DbMenu script- by David Boggus: http://www.boggusweb.com/
	* Please keep this notice intact
	* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and more
	***********************************************/

	</script>
	<link href="http://www.javascriptkit.com/script/script2/dbmenu/global.css" type="text/css" rel="stylesheet" media="screen">
	<link href="http://www.javascriptkit.com/script/script2/dbmenu/dropDown.css" type="text/css" rel="stylesheet" media="screen">
	<ul id="menu" class="dbMenu onMouse">

        <li><a href="http://www.javascriptkit.com">Home</a></li>
		<li>News
            <ul>
				<li><a href="http://www.cnn.com">CNN</a></li>
        <li><a href="http://news.bbc.co.uk">BBC News</a></li>
        <li><a href="http://abcnews.com">ABC News</a></li>
            </ul>

		</li>

	    <li>Web Design
            <ul>
                <li><a href="http://javascriptkit.com">JavaScipt Kit</a></li>
                <li><a href="http://dynamicdrive.com">Dynamic Drive</a></li>
                <li><a href="http://www.cssdrive.com">CSS Drive</a></li>
                <li><a href="http://www.codingforums.com">Coding Forums</a></li>

            </ul>
	    </li>
	    <li><a href="http://javascriptkit.com/jsref/">JS Reference</a></li>
	    <li><a href="http://javascriptkit.com/domref/">DOM Reference</a></li>

	</ul>

Open in new window

0
 

Author Comment

by:Pangeia
ID: 33663806
Thanks so much.

IT works great.

My menu inserts and when I move my mouse down to the sub menu, the menu stays and I can click my links.
0
 

Author Closing Comment

by:Pangeia
ID: 33663820
It helped me complete my task.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33663834
Make sure to change the paths to your own paths. Perhaps that was your problem...
0
 

Author Comment

by:Pangeia
ID: 33663986
Actually, I did try tinkering with my original website I was working with.

The problem was very simple.

As you had stated I should not have had reference to the java script in the parent page.  Once I removed it, it started working.

Just thought I would throw that out there.  Thanks again.  Learned a lot.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
How to parse custom JSON to POJO java 4 52
Scripting vs. Programming languages 25 150
how do i compare an object based on two fields 6 48
more than one jdk and one jre 1 30
Introduction Since I wrote the original article about Handling Date and Time in PHP and MySQL (http://www.experts-exchange.com/articles/201/Handling-Date-and-Time-in-PHP-and-MySQL.html) several years ago, it seemed like now was a good time to updat…
Introduction This article is the second of three articles that explain why and how the Experts Exchange QA Team does test automation for our web site. This article covers the basic installation and configuration of the test automation tools used by…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

919 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

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now