JavaScript Drop-down Tutorial
- 1). Open a blank text document in any text editor.
- 2). Start the html document with the following code:
<html>
<head> - 3). Type the line "<script language="javascript"> to define the script.
- 4). Create a function that creates an array with the following code:
function create_Array()
{ var arg = create_Array.arguments;
for ( var i=0; i<arg.length; i++ )
{ this[i] = arg[i]; }
this.length = arg.length; } - 5). Add the links to the array with the following code:
var links = new create_Array(
"home.html",
"aboutme.html",
"portfolio.html",
"blog.html",
"links.html"); - 6). Create the function that will open the URL:
function locate(which)
{ m = which.selectedIndex;
url = links[m];
location.href = url;
} - 7). End the script and the head section of the document with the following code:
</script>
</head> - 8). Create the drop-down menu with the following code:
<body>
<form name="form1">
<select name="menu" onChange="locate(this)">
<option>Home</option>
<option>About Me</option>
<option>Portfolio</option>
<option>Blog</option>
<option>Links</option>
</form> - 9). End the html document with the following code:
</body>
</html> - 10
Test the drop-down menu by opening the file in any web browser.
Source...