April 09, 2008

(16) Comments

How to Create Dropdown Menu

Kendhin

What is dropdown menu?
Dropdown menu is like this :



Here is the trick how to create dropdown menu :

Copy the code below and put it on your page elements.


<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Blog Archive</option>
<option value="Links 1">Text 1</option>
<option value="Links 2">Text 2</option>
</select>

The red text is links, change it with your links.
The blue text is Anchor text. Yau must change it.

For example :


<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Blog Archive</option>
<option value="http://trick-blog.blogspot.com/2008/02/tutorial-to-create-dtree-menu.htmll"> How to Create Dtree Menul </option>
<option value="http://trick-blog.blogspot.com/2008/01/how-to-create-search-engine-in-blogger.html"> How to Create Search Engine </option>
</select>

The result would be like this:



To add more menu/item, put a code like below

<option value="Links 3">Text 3</option>

before this code </select>

If you want the links opened in new window, change the code below

<select onChange="document.location.href=this.options[this.selectedIndex].value;">

with this code ::

<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">

The resul would be like this:






Related Articles :



16 Responses to "How to Create Dropdown Menu"
Madhu said :
August 21, 2008 10:28 AM
This is really helped me
Anonymous said :
September 8, 2008 2:57 AM
thaaaaank yooooooou im very happy to fund a solution of my problem in this web site XD

Thank You :)
atok said :
September 15, 2008 10:14 AM
makasih ilmunya
Aldhis said :
October 3, 2008 2:22 PM
Hi, thx a lot for the drop down menu..
this really save my sidebar space... :)
October 6, 2008 12:49 AM
Hi,

Thanks for this! I am wondering if you can change the width? i want to put it in my sidebar and i have 2 so the width is off. i know i can put in shorter link text- but this will not work for me. can a set size be put in the code?

Thanks
October 7, 2008 2:34 AM
one more thing- when i try to change the code to open in a new window, it doesn't work. can you direct me on how i can do this?

thanks
Mysun said :
November 7, 2008 2:18 AM
bagus
mr-ip said :
January 7, 2009 6:02 PM
nice article... i'll try this trick...
January 22, 2009 5:37 PM
Really explained well, hoping to read more from u.
HARISH KUMAR said :
January 28, 2009 7:58 PM
that is excellent way of creating dropdown menu.
I know about it but you explain in excellent way.
That will help in Website design.
wow gold said :
April 18, 2009 4:04 PM
Gold key link for( wow power leveling )the law by (wow power leveling)the law by( wow power leveling )all, such as bubble( power leveling )shadow dream hallucinations, such( wow gold )as exposed as well( wow powerleveling )as electricity, should be the case
May 27, 2009 9:34 AM
Wow nice trick. ehem.. but it doesnt work in my log. I think I dont know where it should be pasted. Could you please help me out??
July 2, 2009 2:13 PM
:f

hloooo
thanks
Arafin said :
September 21, 2009 2:39 PM
For Exclusive Blogger Tips Tricks & Full Version Blogger Templates Visite

http://Tips-tricks-for-blogger.blogspot.com

U Will Be Surprise Check This Out Guys!
Arafin said :
September 21, 2009 2:39 PM
For Exclusive Blogger Tips Tricks & Full Version Blogger Templates Visite

http://Tips-tricks-for-blogger.blogspot.com

U Will Be Surprise Check This Out Guys!

Post a Comment