Full version: jsB@nk » Form » Dropdown » Drop Down Info Box
URL: https://www.javascriptbank.com/drop-down-info-box.html
This script reveals information, based on the user's selection in a drop down box. Can be used for a FAQ, contact info, and more. Short and sweet, with comments.
Full version: jsB@nk » Form » Dropdown » Drop Down Info Box
URL: https://www.javascriptbank.com/drop-down-info-box.html
<style type="text/css">#form1 { color: #000; background:#EFE3C2; width:200px; padding: 10px; display:none;}#form2 { color: #000; background:#D9EFC2; width:200px; padding: 10px; display:none;}#form3 { color: #000; background:#C2E7EF; width:200px; padding: 10px; display:none;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script type="text/javascript">// Created by: Ricom Productions | http://ricom.co.ukfunction selectForm(frm){ // Select the div containing all the hidden forms var hiddenForms = document.getElementById("allForms"); // Select every form within the above div and assign it to an array theForm = hiddenForms.getElementsByTagName("form"); // Set the display for each of the above forms to NONE for(x=0; x<theForm.length; x++){ theForm[x].style.display = "none"; } // If the form selected from the list exists, set it's display to BLOCK if (theForm[frm-1]){ theForm[frm-1].style.display = "block"; }}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><form name="selector"> <select id="someID" name="someID" onChange="selectForm(this.options[this.selectedIndex].value)"> <option> Select a Question </option> <option value="1"> Question 1</option> <option value="2"> Question 2</option> <option value="3"> Question 3</option> </select></form><div id="allForms"> <form id="form1"> This is Question 1. Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. </form> <form id="form2"> This is Question 2. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat. </form> <form id="form3"> This is Question 3. Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum. </form></div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->