Hi,

Could anyone please tell me the name of the following navbar style? (or even better, where I can get it from);

http://www.avhe.co.uk/page/Home

So a horizontal, click for sub menu to appear navbar.

I've spent an eternity looking but just don't seem able to find it. Any help would be greatly appreciated.

Jquery + CSS...

CSS:

#menu {height: 30px; border: 1px solid #000; z-index: 100; clear: both;}
#menu li {float: left; position: relative;}
#menu ul {display: none; position: absolute; z-index: 120; width: 200px; background: #efefef;}
#menu ul li {clear: both; padding-right: 10px;}

HTML:

<ul id="menu">
<li>Click here
<ul>
<li>Something here</li>
<li>Something here</li>
<li>Something here</li>
</ul>
</li>
</ul>

Then, link a Jquery.js, get it from http://www.jquery.com...

Script:

<script type="text/javascript">
$(function () {
$('#top-menu li').click(
function () {$('ul', this).slideDown(100);},
function () {$('ul', this).slideUp(100);
});
})
</script>

Should be something like that

Hope that help...

Thanks a lot

I'm with you until the Jquery.js Could yo explain that a little bit more please?

It's only a simple "show/hide" script.

A quick knock together would be, http://www.modtalk.co.uk/_site/code/...izontal-menus/

Originally Posted by chrishirst

It's only a simple "show/hide" script.

A quick knock together would be, http://www.modtalk.co.uk/_site/code/...izontal-menus/

Thanks for the term, it'll assist in searching.

Though, I know what the final outcome looks like, hence the link

I was hoping to find a guide as simple as this one, but obviously for the 'show/hide' script.

Though, I know what the final outcome looks like, hence the link

View the source of the page I linked and you will find ALL THE CODE YOU NEED to create the menu.
the CSS is at http://www.modtalk.co.uk/_site/code/...enus/style.css.



AND It took me all of 10 minutes to write that example. so I wouldn't like to think it was wasted