How Do I Do This Effect?

…and what is it called? You have a list of links but they aren’t like text links, and they only open when you click the button.

[Example]

Its towards the bottom… Thanks guys :slight_smile:

I didn’t test this, and Im rusty in my HTML, but try this…

<FORM NAME="list">
<select name="items" size="5">
<option value="page1.html">item1</option>
<option value="page2.html">item2</option>
<option value="page3.html">item3</option>
<option value="page4.html">item4</option>
<option value="page5.html">item5</option>
<option value="page6.html">item6</option>
<option value="page7.html">item7</option>
<option value="page8.html">item8</option>
</select><BR><BR>
<input type="button" onclick="window.location=document.list.items.options[document.list.items.selectedIndex].value;" value="  Go  ">
</FORM>

You create the form item, and inside that form item you create a select area that will display 5 items. Within the select tags you will use option tags to add to the list of items… the value attribute of those tags will hold the URL to the file you want that option to go to.

Then you create the button to go, and set the onClick (when you press it) to get the information from the value parameter of the option you have selected, then it takes you there.

<FORM NAME=“list”>
<select name=“items” size=“10”>
<option value=“http://www.kirupa.com”>item1</option>
<option value=“http://www.kirupa.com”>item2</option>
<option value=“http://www.kirupa.com”>item3</option>
<option value=“http://www.kirupa.com”>item4</option>
<option value=“http://www.kirupa.com”>item5</option>
<option value=“http://www.kirupa.com”>item6</option>
<option value=“http://www.kirupa.com”>item7</option>
<option value=“http://www.kirupa.com”>item8</option>
</select>
<br>
<input type=“button” onclick=“window.location=document.list.items.options[document.list.items.selectedIndex].value;” value=" Read ">
</FORM>

<FORM NAME=“list”>
<select name=“items” size=“5”>
<option value=“http://www.kiupa.com”>item1</option>
<option value=“http://www.kiupa.com”>item2</option>
<option value=“http://www.kiupa.com”>item3</option>
<option value=“http://www.kiupa.com”>item4</option>
<option value=“http://www.kiupa.com”>item5</option>
<option value=“http://www.kiupa.com”>item6</option>
<option value=“http://www.kiupa.com”>item7</option>
<option value=“http://www.kiupa.com”>item8</option>
</select><BR>
<input type=“button” onclick=“window.location=document.list.items.options[document.list.items.selectedIndex].value;” value=" Go ">
</FORM>

Thanks Beta, that works and everything, but how do I change the width of it? I fooled around with it for about 10 minutes but couldn’t get it, and I am horrible with forms, I’m a beginner… :slight_smile:

Okay, I think I got it now after messin around. The width goes by itself? Like since the titles up there were only 6 digits long it won’t be too wide, but if a selection was Pneumonoultramicroscopicsilicovolcanoconiosis then it’d be wide. Is that the only way to make it wider?

I don’t know anythin about html either, but you can add blank space :stuck_out_tongue: I know not the most practical way, but it should work :slight_smile:

in this tag right here


<select name="items" size="5">

Add this style=“width:200px;” or whatever you want to make it.


<select name="items" size="5" style="width:200px;">

What he said…

that was quite an unnecessary post there LIB… :wink:

Yeah I know, but I didn’t want him to think I forgot about this thread, I was away for the past few days and wasn’t able to check back here.

yea sure, excuses excuses…

When the heck was this sarcasm thing implemented, I see it everywhere… ARGH!!!

Thanks guys.