Old 04-14-2008   #1 (permalink)
Registered User
 
Join Date: Oct 2007
Posts: 68

CSS drop down menu

What is the easiest way to do drop down menu in dreamweaver?
Ive tried search on google but there are several things that I dont understand..

I tried entering this code.....

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>PVII CSS Express Drop-Down Menu</title>
<link href="p7exp/p7exp.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="p7exp/p7exp.js"></script>
<!--[if lte IE 7]>
<style>
#menuwrapper, #p7menubar ul a {height: 1%;}
a:active {width: auto;}
</style>
<![endif]-->
</head>
<body onLoad="P7_ExpMenu()">
<div id="menuwrapper">
<ul id="p7menubar">
<li><a href="#">Home</a></li>
<li><a class="trigger" href="#">Trigger One</a>
<ul>
<li><a href="#">Sub 1.1</a></li>
<li><a href="#">Sub 1.2</a></li>
<li><a href="#">Sub 1.3</a></li>
<li><a href="#">Sub 1.4</a></li>
</ul>
</li>
<li><a class="trigger" href="#">Trigger Two</a>
<ul>
<li><a href="#">Sub 2.1</a></li>
<li><a href="#">Sub 2.2</a></li>
<li><a href="#">Sub 2.3</a></li>
<li><a href="#">Sub 2.4</a></li>
<li><a href="#">Sub 2.5</a></li>
</ul>
</li>
<li><a class="trigger" href="#">Trigger Three</a>
<ul>
<li><a href="#">Sub 3.1</a></li>
<li><a href="#">Sub 3.2</a></li>
<li><a href="#">Sub 3.3</a></li>
<li><a href="#">Sub 3.4</a></li>
<li><a href="#">Sub 3.5</a></li>
<li><a href="#">Sub 3.6</a></li>
<li><a href="#">Sub 3.7</a></li>
<li><a href="#">Sub 3.8</a></li>
</ul>
</li>
</ul>
<br class="clearit">
</div>
</body>
</html>

but it came out like this on the explorer (attached file)....
I found this tutorial from this web :
CSS Express Pure CSS Drop-Down and Popup Menus by PVII
Attached Thumbnails
css-drop-down-menu-image.gif  
mary is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 04-14-2008   #2 (permalink)
Janitor of Lunacy
 
tamlin's Avatar
 
Join Date: May 2006
Location: Sitting in the Wishing Chair
Posts: 4,627

  1. Did you download and unzip the support files (p7exp.css, p7exp.js and the images)?
  2. If so, have you installed them in the correct folder structure?
    • A folder p7exp that contains your CSS and JS files
    • A sub-folder fireworks that contains p7Express.png
    • A sub-folder images that contains the background images
  3. Is JavaScript enabled in your browser?
__________________


Religion: It's all fun and games until someone gets burned at the stake...
tamlin is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 04-14-2008   #3 (permalink)
Registered User
 
Join Date: Oct 2007
Posts: 68

Quote:
Originally Posted by tamlin View Post
  1. Did you download and unzip the support files (p7exp.css, p7exp.js and the images)?
  2. If so, have you installed them in the correct folder structure?
    • A folder p7exp that contains your CSS and JS files
    • A sub-folder fireworks that contains p7Express.png
    • A sub-folder images that contains the background images
  3. Is JavaScript enabled in your browser?
Ok...i doubled check and seems that I have two folders of p7exp...that's because i unzip the file and straight away move it to the root folder..Anyway, the matter has been solved..

Now how am I gonna change the colour tamlin? Im a bit slow with this script..
I guess have to change it in adobe huh?
mary is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 04-14-2008   #4 (permalink)
Janitor of Lunacy
 
tamlin's Avatar
 
Join Date: May 2006
Location: Sitting in the Wishing Chair
Posts: 4,627

Quote:
Originally Posted by mary View Post
Now how am I gonna change the colour tamlin? Im a bit slow with this script..
I guess have to change it in adobe huh?
If you mean the colours in the background image files, you could try changing them in Photoshop but that might be tricky with gradients. It might be a better idea if you create your own gradient images from scratch. Make them the same dimensions and give them the same names as the originals and then you won't need to edit your CSS code.
__________________


Religion: It's all fun and games until someone gets burned at the stake...
tamlin is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Vertical Menu Problem ecntrc HTML / PHP / ASP / JS 10 07-18-2006 09:31 AM
Animated Menu Bar ecntrc Adobe Photoshop 7 05-18-2006 06:17 PM
I need help on JavaScript - Drop down menu ParaSnake HTML / PHP / ASP / JS 0 06-14-2005 06:46 AM
Drop Downs Stiker HTML / PHP / ASP / JS 9 01-12-2005 01:53 PM


All times are GMT +1. The time now is 08:16 AM.
Content Relevant URLs by vBSEO 3.2.0 RC7

Design & Content © BioRUST 2007 :: PRIVACY STATEMENT :: LEGAL INFORMATION :: ADVERTISING MEDIA KIT