PDA

View Full Version : Help Creating Menu



drummer392
June 26th, 2009, 09:36 PM
How can I create a menu like the one on this page: http://donan.com/Home/Home-Page.aspx

frostBite
June 27th, 2009, 01:13 AM
That is a CSS menu, and it's really easy to find tutorial online.

I'd start here:

13styles.com/ (http://13styles.com/)
&
www.dynamicdrive.com/style/csslibrary/category/C1/ (http://www.dynamicdrive.com/style/csslibrary/category/C1/)

drummer392
June 27th, 2009, 04:09 AM
i don't know if you knew I meant the side menu. But I am trying to achieve the side menu effect. Although I appreciate your input.

Swooter
June 27th, 2009, 08:28 AM
- Put a <ul> with <li> tags inside a <div> (or <td>)
- Put <a> links in the <li> elements
- Use custom <li> bullet points... example: list-style-image: url("bullet.gif");
- Repeat (y) a gradient background image in css on the <div>

simplistik
June 27th, 2009, 08:32 AM
:lol: man you're killin' me. What's with all these simple simple questions Mr.



I can integrate a lot of features into your site, such as:

PHP & MYSQL Content Management Systems
Video Integration
Polls
Adobe Flash element (such as slideshows or navigation)
Restricted areas
and much more!


If you use jQuery and you have a nav structure as such:



<ul id="nav">
<li><a href="#" class="main">Main Nav</a>
<ul>
<li><a href="#">Sub Nav</a></li>
<li><a href="#">Sub Nav 2</a></li>
<li><a href="#">Sub Nav 3</a></li>
<li><a href="#">Sub Nav 4</a></li>
</ul>
</li>
</ul>


your code would JS could look something like:



$('#nav .main').click(function() {
$(this).siblings('ul').slideToggle();
return false;
});


another way to do it would be



$('#nav li a:first-child').click(function() {
$(this).siblings('ul').slideToggle();
return false;
});