FRIHOSTFORUMSFAQTOSBLOGSDIRECTORY
You are invited to Log in or Register a Frihost Account!

Drop down boxes on click?

 


ncwdavid
Hey,

Ok so I am making this site and I want this cool kind of feature I have seen on a lot of modern sites lately like Bebo and Facebook. I do not know what it is called so I find trouble getting information about it on Google. Here is what it does:

Lets say there is a box with "Navigation" as the heading on it, but there is nothing underneath it. Then all you have to do is click on that box and the navigation pops down under it and then when you click on the box again it pops back up and it is gone, almost like it disappears.

I am not sure of the language used to do this, I am just assuming its Javascript.

If anyone knows how to do this or knows a place with information about it or even just what its called so I can Google it could you please tell me. Thank you.
alalex
Yea, this is javascript.
Now you can program it yourself and let it be a pain... or you can use a library like jquery and do nothing...

Assuming you chose the second option, go to jquery's homepage (search google) and download it. I'm assuming you have at least some knowledge of javascript, if not you can for sure use google to learn, its very easy.
Include the jquery file in yout html page, with a navigation structure like this:
Code:
<div id="navContainer">
<a href="javascript:;" id="toggle">Navigation:</a>
<div id="navigation" style="display:none">
<!-- Your navigation here -->
</div>
</div>


And in the head, in a javascrip snippet, paste the following:
Code:
$("a#toggle").click(function () {
      $("div#navigation").slideToggle("slow");
});


And there you go. If it doesnt work, or you dont know how to use it, post here.
Wink
ncwdavid
Thanks! I'll try it out now!
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.