# How Do I Do This Effect?

**URL:** <https://forum.kirupa.com/t/how-do-i-do-this-effect/26729>\
**Category:** programming\
**Created:** [July 25, 2003, 6:38pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729 "2003-07-25T18:38:25Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![sdrawkcaB](https://avatars.discourse-cdn.com/v4/letter/s/22d042/32.png) [@sdrawkcaB](https://forum.kirupa.com/u/sdrawkcaB)\
**Post date:** [July 25, 2003, 6:38pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/1 "2003-07-25T18:38:25Z")

</div>

…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](http://www.hiphopinfinity.com/Underground/)]

Its towards the bottom… Thanks guys 🙂

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 25, 2003, 7:47pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/2 "2003-07-25T19:47:18Z")

</div>

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

```php
<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.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 26, 2003, 12:34pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/3 "2003-07-26T12:34:02Z")

</div>

\<FORM NAME=“list”\>  
\<select name=“items” size=“10”\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item1\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item2\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item3\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item4\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item5\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item6\</option\>  
\<option value=“[http://www.kirupa.com](http://www.kirupa.com)”\>item7\</option\>  
\<option value=“[http://www.kirupa.com](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\>

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 26, 2003, 12:35pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/4 "2003-07-26T12:35:32Z")

</div>

\<FORM NAME=“list”\>  
\<select name=“items” size=“5”\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item1\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item2\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item3\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item4\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item5\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item6\</option\>  
\<option value=“[http://www.kiupa.com](http://www.kiupa.com)”\>item7\</option\>  
\<option value=“[http://www.kiupa.com](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… 🙂

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 26, 2003, 12:44pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/5 "2003-07-26T12:44:48Z")

</div>

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?

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 27, 2003, 3:52am UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/6 "2003-07-27T03:52:49Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 27, 2003, 8:56am UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/7 "2003-07-27T08:56:56Z")

</div>

in this tag right here

```php

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

```

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

```php

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

```

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 3:16pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/8 "2003-07-28T15:16:46Z")

</div>

What he said…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 3:22pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/9 "2003-07-28T15:22:06Z")

</div>

that was quite an unnecessary post there LIB… 😉

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 3:28pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/10 "2003-07-28T15:28:09Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 3:30pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/11 "2003-07-28T15:30:11Z")

</div>

yea sure, excuses excuses…

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 3:35pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/12 "2003-07-28T15:35:40Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [July 28, 2003, 4:10pm UTC](https://forum.kirupa.com/t/how-do-i-do-this-effect/26729/13 "2003-07-28T16:10:35Z")

</div>

Thanks guys.