Page 1 of 1

[SOLVED]javascript drop down menu

Posted: Fri Aug 05, 2005 6:55 am
by rubberjohn
i have pretty much no experience with javascript at all but i need to create a drop down menu for a project i am working on.

i would like to create something like the FAQ menu found at

http://www.nike.com/timing/usa/en/produ ... A0027.html

can anyone give me a few pointers to create this or alternatively tell me where i can find a tutorial to make it.

thanks for your help

rj

Posted: Fri Aug 05, 2005 7:41 am
by Skittlewidth
Hello again.

if you go to http://www.nike.com/timing/common/js/selectbox.js in FireFox you can see the code behind the Nike select box and if you look in the source of the page you mentioned then you can see how the code is initialised.

Don't just rip off this code - look, learn and adapt. 8)

Posted: Fri Aug 05, 2005 7:53 am
by rubberjohn
so thats all i need?

dont worry i wasn't going to rip it off, i need to learn js. also the implementation i need is different to this so i would need to understand how it works to get what i want

Posted: Fri Aug 05, 2005 8:20 am
by Skittlewidth
Well that would be all you needed to implement the exact same menu, yes.

I couldn't find any tutorials on styling select boxes specifically. I'm sure there are ways of doing this sort of thing in a basic way in CSS alone. Not sure about the cross browser effects though. :?

I'm no javascript expert myself - it never seems to do what I expect it to do when I do have to use it, so I'm sorry I can't be of much more help!

How did you want to use this in your project?

Posted: Fri Aug 05, 2005 8:51 am
by rubberjohn
i want a drop down menu that will direct an email to the correct recipient - i know how to do all of that it was just the drop down menu bit i was getting stuck on

cheers you've been a big help today

tried that

Posted: Tue Aug 09, 2005 6:50 am
by rubberjohn
ok ive tried to replicate the menu exactly but when its on my local machine the drop down graphics (the small box and arrow of the menu) do not display and all of the answers, that im guessing should be hidden somehow, are all displayed at once even before the drop down menu is activated.

any ideas??

thanks

rj

Posted: Tue Aug 09, 2005 8:02 am
by Skittlewidth
It does look quite tricky to recreate. Maybe have a look at this tutorial and see if you can make a similar menu that way?

http://webfx.eae.net/dhtml/select/jsGenerated.html

Posted: Wed Aug 10, 2005 2:46 am
by CoderGoblin
Another possibility is to use Suckerfish dropdowns

Posted: Wed Aug 10, 2005 5:36 am
by rubberjohn
the suckerfish and the custome select box stuff looks more like it

im guessing that the really complicated side of the nike drop down menu comes with the scrolling of the content of the drop down menu - ie placing the scroll controls and controlling the scroll itself

i have managed to recreate it locally but it is a bit advanced for me to start of with - it uses (as much as i understand) three javascript files and two css files to constuct it and make it functional

but i will see what i can do with the tutorials