Inserting dropdown menu script [Archive]

gmsslik

06-22-2007, 02:25 AM

I came across this great script on the dynamic drive site... Here is the link to the script. http://www.dynamicdrive.com/dynamicindex1/dropdowncontrol.htm I was wondering exactly how I would apply it to my code. I am wokring in dreamweaver. I want to know how to apply it to an image so the dropdown menu comes down from the image. Thanks so much!

dog

06-23-2007, 01:00 AM

I've downloaded the code from the link you gave and made a couple of simple changes.

I deleted the Search Form script, and
I put an image tag in place of the text, 'Main Menu'.

Here's the edited code.

<html>
<head>

<title>Dropdown Sample</title>

<script type="text/javascript" src="dropdown.js">
</script>

<style type="text/css">

div.sample_attach, a.sample_attach
{
width: 100px;
border: 1px solid black;
background: #FFFFEE;
padding: 0px 5px;
font-weight: 900;
color: #008000;
}

a.sample_attach
{
display: block;
border-bottom: none;
text-decoration: none;
}

form.sample_attach
{
position: absolute;
visibility: hidden;
border: 1px solid black;
background: #FFFFEE;
padding: 0px 5px 2px 5px;
}

</style>

</head>
<body>


<div id="menu_parent">
<img width="300px" height="100px" src="..." class="sample_attach" />
</div>
<div id="menu_child" style="position: absolute; visibility: hidden;">
<a class="sample_attach" href="#">Item 1</a>
<a class="sample_attach" href="#">Item 2</a>
<a class="sample_attach" style="border-bottom: 1px solid black;" href="#">Item 3</a>
</div>

<script type="text/javascript">
at_attach("menu_parent", "menu_child", "hover", "y", "pointer");
</script>

<br /><br /><br /><br />

</body>
</html>

I hope that helps.

Peace,
dog