Welcome to WebmasterWorld Guest from 54.144.108.92

Forum Moderators: incrediBILL

Message Too Old, No Replies

Making Reactive Drop Down Link Menus

     
9:36 pm on May 5, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Sept 28, 2001
posts:1380
votes: 0


What is the secret to making form drop down lists that immediately take you to the link you choose when you release the mouse button (without having to click "submit")?

Also, can it be done in a search engine friendly way?

11:10 pm on May 5, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Mar 27, 2003
posts:664
votes: 0


Done in javascript (e.g. using the onchange event), hence not search engine friendly. To make it search engine friendly, you could include a <noscript> tag containing all the <a ...> links corresponding to each of the options in the drop-down.

Shawn

8:28 am on May 6, 2003 (gmt 0)

New User

10+ Year Member

joined:Apr 6, 2003
posts:17
votes: 0


Here is the non-SE friendly version:

<form>
<SELECT name="SELECT" onchange="window.location=this.options[this.selectedIndex].value;">
<OPTION value="">Site Menu....
<OPTION value="">-----------------------
<OPTION value="home.html">Home Page
<OPTION value="photo.html">Photo Galleries
<OPTION value="links.html">Links
</SELECT>
</form>

I would suggest you put simple text links elsewhere on the page, like at the bottom - not only for SEO, but for the few users who keep Javascript disbaled.

8:51 am on May 6, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:Mar 17, 2003
posts:384
votes: 0


Doesnt Google not like <noscript> tags however because I noticed a few months ago that google dropped a load of listing because of the <noscript> tag..!
3:13 pm on May 6, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Sept 28, 2001
posts:1380
votes: 0


That works great. I have a shopping cart where the customer has to select 4 options and it makes it much easier for the customer now. Thanks for your help.

For other uses it would be cool to have a search engine friendly version, so if anyone knows, I hope you'll give me a hint.

3:20 pm on May 6, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Sept 28, 2001
posts:1380
votes: 0


Is there a way to pass variables using the above javascript example?

If not, that messes up my plan.

11:55 pm on May 7, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:Sept 4, 2002
posts:508
votes: 0


You should be able to pass variables from a form, if the drop-down is inside of it, by changing the code to something like:

.. onchange="document.forms[0].action=this.value;document.forms[0].submit();"

Or if it's just one or two variables, you can put them in the querystring:
[Serverside variable]

.. onchange="location.href=this.value+'?inputVar=<%= serverVar %>';"

[Javascript or DOM variable]

.. onchange="location.href=this.value+'?inputVar='+document.getElementById('myVarToPass');"

If that's even close to what you need, hope it helps a little..
g.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members