View Single Post
Old 11-30-2012, 02:03 PM   PM User | #2
Philip M
Supreme Master coder!

 
Philip M's Avatar
 
Join Date: Jun 2002
Location: London, England
Posts: 17,036
Thanks: 197
Thanked 2,411 Times in 2,389 Posts
Philip M has a spectacular aura aboutPhilip M has a spectacular aura aboutPhilip M has a spectacular aura about
Try this:-

Code:
<html>
<head>
</head>
<body>

<form id="myForm" >

<select id = "mylist" onchange = "showdivs()">
<option value = 0>Please select a number...</option>
<option value = 1>1</option>
<option value = 2>2</option>
<option value = 3>3</option>
<option value = 4>4</option>
</select>
<br><br>	

<div id="MyDivNumber1" style="display: none">	Hi, I'm Div Number 1</div><br>
<div id="MyDivNumber2" style="display: none">	Hi, I'm Div Number 2</div><br>
<div id="MyDivNumber3" style="display: none">	Hi, I'm Div Number 3</div><br>
<div id="MyDivNumber4" style="display: none">	Hi, I'm Div Number 4</div><br>

</form>


<script type = "text/javascript">

function showdivs() {
var numdivs = 4;  // number of divs - could be 50 or as many as you like
var num = document.getElementById("mylist").value;
for (var i =1; i<=numdivs; i++) {
var which = "MyDivNumber" + i;  // naming convention for div ids
document.getElementById(which).style.display = num>=i? "block" : "none";
}
}

</script>

A <div> is a block level element, not inline.

Lady Astor said to Winston Churchill "If I was married to you, I would put poison in your whisky".
To which Churchill replied "If I was married to you, I would drink it".
__________________

All the code given in this post has been tested and is intended to address the question asked.
Unless stated otherwise it is not just a demonstration.

Last edited by Philip M; 11-30-2012 at 02:38 PM..
Philip M is offline   Reply With Quote
Users who have thanked Philip M for this post:
janehollin (11-30-2012)