Snap Builder HTML5 CSS3 Free Public Codes Library


<!DOCTYPE html>
<head>
<title>Drop Down Menu Description Box Javascript Code Snippet</title>

<style>
BODY {font-family:verdana,arial,ms sans serif; font-size:90%; color:#000000;}
select {background: rgba(0,0,0,0.3);color:#000;text-shadow:0 1px 0 rgba(0,0,0,0.4);}
option:not(:checked) {background-color:#dddddd; color:#000;}
input {background-color: rgba(0,0,0,0.3);border-color:efefef; color:#000; font-family:verdana, arial, ms sans serif; font-weight:bold; font-size:10pt; text-align:center;text-shadow:0 1px 0 rgba(0,0,0,0.4)}
</style>

<script>
<!--
/* Begin Drop Down Menu Description Box
== This Script Free To Use Providing This Notice Remains ==
== This Script Has Been Found In The http://www.SnapBuilder.com Free Public Codes Library ==
== NOTICE: Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply ==
== Created by: Sandeep Gangadharan : http://sivamdesign.com/scripts/ : Creative Commons License ==
*/
var message=new Array();
message[0] = "When you select any links from the above menu their corresponding explanatory content will automatically be shown in this textarea. By clicking the 'Go' button you will be taken straight to the chosen link!"
message[1] = "For some free and useful scripts that have been created keeping in mind their usability, practicability, and compatibility. Be sure to check them all!"
message[2] = "The free complete web development resource center. The one place to go for all your web designing needs and for some very useful freeware programs and links to some of the best available web resources!"
message[3] = "The best place to go for some very useful webmaster tips and tricks to enhance your web pages."

function chooseText() {
        if (document.dpdw.choice.selectedIndex==0) { document.dpdw.text.value=message[0]; }
        if (document.dpdw.choice.selectedIndex==1) { document.dpdw.text.value=message[1]; }
        if (document.dpdw.choice.selectedIndex==2) { document.dpdw.text.value=message[2]; }
        if (document.dpdw.choice.selectedIndex==3) { document.dpdw.text.value=message[3]; }
}

function gotoURL() {
        if (document.dpdw.choice.selectedIndex==0) { return; }
        if (document.dpdw.choice.selectedIndex==1) { location.href="http://sivamdesign.com/scripts/"; }
                if (document.dpdw.choice.selectedIndex==2) { location.href="http://www.snapbuilder.com"; }
                        if (document.dpdw.choice.selectedIndex==3) { location.href="http://www.sitepronews.com"; }
                        }
                        // -->
                        </script>

                        </head>
                        <body>

                        <table>
                        <tr>
                        <td>
                        <form name="dpdw">
                        <select name="choice" onChange="chooseText()">
                        <option selected value="0">Select from the following .... &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
                        <option value="1">Sandeep's JavaScript Page</option>
                        <option value="2">SnapBuilder HTML5 / CSS3</option>
                        <option value="3">Site Pro News</option>
                        </select>
                        <input type="button" value="Go!" onClick="gotoURL();" /><br />
                        <textarea name="text" rows="6" cols="40" wrap="virtual"></textarea>
                        </form>
                        </td>
                        </tr>
                        </table>

                        <p>Adjust the STYLES to suit your needs, or remove them all together.</p>

                        </body>
                        </html>