hi to everybody, I want to realize dynamic menu with dreamweaver MX. Please i nead help to do it. Thanks in advance. 
a dynamic menu... JS or CSS???
Using css to make menus is better in my opinion - some people turn off js. also, its cleaner. There are a whole bunch of 'pre-packaged' solutions you can find on google.
| pollux1er wrote: |
| hi to everybody, I want to realize dynamic menu with dreamweaver MX. Please i nead help to do it. Thanks in advance. |
First of all, what do you mean by dynamic? If you are asking about the menus like in Windows menu bar, its possible with the help of JS. If you want a simple menu but with changing colours and styles etc, i have recently developed one and i will share it with you.
| pollux1er wrote: |
| hi to everybody, I want to realize dynamic menu with dreamweaver MX. Please i nead help to do it. Thanks in advance. |
I usually make my navs in purely in CSS, sometimes using a background image if I need to.
also, there are a whole bunch of already made free navigation menus out there on google, but a site that I have found really helpful in the past is < http://css.maxdesign.com.au/index.htm > they have a whole bunch of navigation menus that are totally CSS based and and easy to customize.
| imagefree wrote: | ||
First of all, what do you mean by dynamic? If you are asking about the menus like in Windows menu bar, its possible with the help of JS. If you want a simple menu but with changing colours and styles etc, i have recently developed one and i will share it with you. |
the first option, the one of window on my website
I agree that using CSS is a much "cleaner" way of doing things. It's also a lot easier to learn
| welshsteve wrote: |
| I agree that using CSS is a much "cleaner" way of doing things. It's also a lot easier to learn |
Same here.
I need on example please...
Just put "css menu" into a Google search and you'll have hundreds of examples. Here's a quite example.
Hope this helps
| Code: |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>CSS Menu</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <!-- COMMENT Use the below as a link to an external stylesheet instead and move the below style sheet code into that instead. Do not move the opening and closing style tags, just move the code and delete the style tags from this page. END COMMENT --> <link rel="stylesheet" href="aircraft.css" type="text/css" /> <style type="text/css"> body { background-color: #fff; color: #000; } h1 { font: 14pt tahoma, sans-serif; color: #000; } h2 { font: bold 10pt tahoma, sans-serif; color: #fff; background:#a00; line-height: 25px; width:100%; margin:0; padding:0; border-bottom: 1px solid #000; } #links { width: 150px; height: 100%; float: left; background-color: #00a; margin: 0; border: 2px solid #000; line-height: 20px; } #links a { display: block; font: 10pt tahoma, sans-serif; color: #fff; width: 100%; line-height: 30px; vertical-align: center; border-bottom: 1px solid #000; } #links a:link { text-decoration: none; } #links a:visited { text-decoration: none; } #links a:hover { color:#000; text-decoration: none; background:#aaf;} #links a:active { text-decoration: none; } ul { margin: 0; padding: 0; list-style-type: none; } li { font: 10pt tahoma, sans-serif; } #content { float: left; margin-left: 20px; font: 10pt tahoma, sans-serif; color: #000; } </style> </head> <body> <div id="links"> <ul> <li><h2> Main Index</h2></li> <li><a href="aircraft.html"> Home</a></li> <li><a href="background.html"> Contact Me</a></li> <li><h2> Web Design</h2></li> <li><a href="#"> HTML/XHTML</a></li> <li><a href="#"> CSS</a></li> <li><a href="#"> PHP</a></li> <li><a href="#"> ASP/ASP.NET</a></li> <li><a href="#"> Javascript</a></li> <li><a href="#"> XML</a></li> </ul> </div> <div id="content"> <h1>Welcome</h1> <p>This is a project page for my HTML and Web Development Class</p> </div> </body> </html> |
Hope this helps
I will try this code to see how it works. Thanks in advance.
No problem. That code is a just a basic menu. You can use images and rollover images to make it all look nicer if you wish. Just use the url(filename.gif) in the background property.
e.g.
e.g.
| Code: |
|
background: url(filename.gif); |
 |