[SOLVED]javascript drop down menu

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
rubberjohn
Forum Contributor
Posts: 193
Joined: Fri Feb 25, 2005 4:03 am

[SOLVED]javascript drop down menu

Post 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
Last edited by rubberjohn on Mon Aug 15, 2005 4:13 am, edited 3 times in total.
User avatar
Skittlewidth
Forum Contributor
Posts: 389
Joined: Wed Nov 06, 2002 9:18 am
Location: Kent, UK

Post 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)
rubberjohn
Forum Contributor
Posts: 193
Joined: Fri Feb 25, 2005 4:03 am

Post 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
User avatar
Skittlewidth
Forum Contributor
Posts: 389
Joined: Wed Nov 06, 2002 9:18 am
Location: Kent, UK

Post 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?
rubberjohn
Forum Contributor
Posts: 193
Joined: Fri Feb 25, 2005 4:03 am

Post 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
rubberjohn
Forum Contributor
Posts: 193
Joined: Fri Feb 25, 2005 4:03 am

tried that

Post 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
User avatar
Skittlewidth
Forum Contributor
Posts: 389
Joined: Wed Nov 06, 2002 9:18 am
Location: Kent, UK

Post 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
User avatar
CoderGoblin
DevNet Resident
Posts: 1425
Joined: Tue Mar 16, 2004 10:03 am
Location: Aachen, Germany

Post by CoderGoblin »

Another possibility is to use Suckerfish dropdowns
rubberjohn
Forum Contributor
Posts: 193
Joined: Fri Feb 25, 2005 4:03 am

Post 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
Post Reply