Dynamic pull out menus

[moose41]

Hi all, I'm new here, but I've been designing web pages for a while.

I just have a few questions regarding pull down menus. I want to design my own (learn the concept etc.), but I'm kind of confused on what to use to make them: Jacascript, ASP, DHTML? What is the best, most browser compatible out there?

(to give you an idea, i'm looking into designing something similiar to the Thread Tools/Search This Thread etc. at the top here).

Thanks for all of your time!
(Some of my work: Kahr's Carving , Halo 2: United )

[cscgal]

The menus would need to be done with a client-side language as opposed to server-side. Therefore, languages such as ASP and PHP are out. The menus here were created with a combination of DHTML and JavaScript. (DHTML for the menu itself, and JavaScript in the HTML code to call the function). Your best bet is to check out www.dynamicdrive.com - they have a bunch of similar working code snippets that will help give you ideas. No better way to learn than by example.

[moose41]

The menus would need to be done with a client-side language as opposed to server-side. Therefore, languages such as ASP and PHP are out. The menus here were created with a combination of DHTML and JavaScript. (DHTML for the menu itself, and JavaScript in the HTML code to call the function). Your best bet is to check out www.dynamicdrive.com - they have a bunch of similar working code snippets that will help give you ideas. No better way to learn than by example.

Thanks a lot, cscgal!

Been looking to do this for some time, but wasn't sure where to get started.

[rixius]

Like Dani said, this would be done with client side scripting. and in this case, Javascript. :)

Check out www.dynamicdrive.com or even viewing the source of this forum to check out the .js.

[moose41]

Like Dani said, this would be done with client side scripting. and in this case, Javascript. :) Check out www.dynamicdrive.com or even viewing the source of this forum to check out the .js.

I've implemented the menus (here: http://united.forerunners.org click 'Features'), but there i usually have to click it twice, why is there a delay there?

Also, there wasn't anything on dynamic drive (that i could find) about giving it the "wipe" or "slide" effect. It kind of just appears, which is fine, but i wanted something a bit niftier ;) .

Thanks again for all your help.

[Killer_Typo]

i like your site but it really isnt set up for dynamic menues. it doesnt look good how they cover up the other buttons. maybe try adjusting the layout in a way so that they can pop out and not cover so much up.

[rixius]

It looks good in IE, but when I browse to it in firefox, it looks pretty bad :/.

For just the sliding effect, well, you can search for just the effect itself on dynamic drive, I'm sure they'd have that, then just apply it to the whole div, or table you have as the dropout menu.

[saucer]

You might also want to check out the example at "Drop-Down Menus, Horizontal Style" at "A List Apart" http://www.alistapart.com/articles/horizdropdowns/

[rafael.franco]

There is a problem with IE5 and IE6 to create this pull out menu.
I've created a solution on my website www.cartaomega.com.br . Look at file /scripts/global.js. The main function is:

function menuCss(elemento) {
	if (document.all&&document.getElementById) {
		if(document.getElementById(elemento)) {
			nav = document.getElementById(elemento);
			for (i=0; i<nav.childNodes.length; i++) {
				node = nav.childNodes[i];
				if (node.nodeName=="LI") {
					node.onmouseover=function() {
					this.className+=" over";
					}
					node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
					}
				}
			}
		}
 	}
}