A Scrolling List is very similar in construction to a Pull Down List. Let's add a few more names first.
<form>
<select name="best friend">
<option value="ed">Ed
<option value="rick">Rick
<option value="tom">Tom
<option value="guido">Guido
<option value="horace">Horace
<option value="reggie">Reggie
<option value="myron">Myron
</select>
</form>
All we gotta do to turn it into a Scrolling List is add a size attribute to the <select> tag.
<form>
<select name="best friend" size="4">
<option value="ed">Ed
<option value="rick">Rick
<option value="tom">Tom
<option value="guido">Guido
<option value="horace">Horace
<option value="reggie">Reggie
<option value="myron">Myron
</select>
</form>
The size is simply how many options show in the window. Pretty simple, eh?
Again, the default value is the first <option>, and again we can change that by selecting one.
<form>
<select name="best friend" size="4">
<option value="ed">Ed
<option value="rick">Rick
<option value="tom" selected>Tom
<option value="guido">Guido
<option value="horace">Horace
<option value="reggie">Reggie
<option value="myron">Myron
</select>
</form>
I have no idea why you would use the selection feature for a Scrolling List but it's there and I just felt the need to tell you about it.
Actually, I'll take that back. Here is a perfectly good use for it :-)
(This effect is done using a combination of HTML and JavaScript with a little bit of CSS thrown in. If you're curious about how it was done, the source is here.)
Form Tutor |
Lessons: Intro 1 2 3 4 5 6 7 8 9 10 11 12 13 Quick Forms Reference |
HTML 4.0 Reference Barebones HTML Guide |
![]() |