Href's inside of option

HTML & CSS
1

I was wondering if anyone could tell me; is there a way to get href anchor links within drop down option boxes in a form.
For example, a one page inventory sheet…drop down box at the top to navigate to different sections of the page.

2

No. Just use an unordered list to contain the links, CSS to style their appearance, and then JavaScript to create the behavior you want (but make sure the list still works properly if JavaScript has been disabled, ripped out by a firewall, or is not supported).

3

You could get the same effect if you use use an unordered list like dan says and give it a height, then set it to overflow: auto;

4

It’s not possible, since you cannot have markup inside an option element, only text. It’s defined like this in the DTD:

<!ELEMENT OPTION - O (#PCDATA)>
5

Yea, that’s what I figured I would have to do. No biggie. I’d rather mark it up in css. Just curious.

Oh that’s pretty sweet. How do you know the DTD for html elements?

6

Another way to do it: (Although will not work if JS is disabled)


<select name="whichpage" id="whichpage" 
onChange="if(this.selectedIndex!=0)
self.location=this.options[this.selectedIndex].value">
<option value="#section1" selected>link1
<option value="#section2" selected>link2
<option value="#section3" selected>link3
<option value="#section4" selected>link4
</select>
7

You do too, hopefully. The URL should be in the doctype declaration at the top of every HTML document you create. :slight_smile:

For HTML 4.01 Strict: http://www.w3.org/TR/html4/strict.dtd

8

I never actually followed that URL.
Nice! This is amazing. I’m viewing the DTD for xhtml transitional and I have to say, it’s beautiful. I’m going to give it a valentine :big_pink_valentine:

9

if you really have to use a drop down list
i would say go for the JS solution JimmyPaddy gave u its perfect.

other than that its a list like everybody is telling u, but if i follow u right on this u need the click then open effect for this so u have to spice things up with a little of javascript i made something like this http://www.some1ne.com/d/FBLikeMenu/FBLikeMenu.htm feel free to use the code.

10

I like that menu, Fouad. Any chance you can make the text clickable (perhaps making the link contain both the text and the drop arrow)?

11

href in an <option> tag. now i’ve heard everything. :slight_smile:

12