ciao ragazzi!!ho un problema con il sovrapporre tre div..in pratica io ho queste tre div:
Codice PHP:<div>
<DIV id="marker_div" style="position:absolute;display:block; left:250px; top:0px; width:350px; height:450px; z-index:400;background-color:white" align="left" valign="top">
<h2>Option Chart</h2>
<div style="width: 150px; float: left;">
<input type="checkbox" id="Lines_Check" checked="checked" class="styled" /> Lines</p>
<input type="checkbox" id="Areas_Check" checked="checked" class="styled" /> Areas</p>
<input type="checkbox" id="Markers_Check" checked="checked" class="styled" /> Markers</p>
<label>Shadow :</label>
<label>     Offset right: </label><input style="width:40px" type="text" id="Shadow_dx" tabindex="1" value="" title="offset to the right">
<label>     Offset down: </label><input style="width:40px" type="text" id="Shadow_dy" tabindex="1" value="" title="the offset down">
<label>     Width:  </label><input style="width:40px" type="text" id="Shadow_dw" tabindex="1" value="" title="the width of the shadow line">
<label>Gap</label>
<input style="width:80px" type="text" id="Gap" name="Gap" tabindex="1" value="" title="spacing between your bars or columns">
<label>Color Area</label>
<select id="Area_Color">
<option value="grey">Grey</option>
<option value="black">Black</option>
<option value="blue">Blue</option>
<option value="cyan">Cyan</option>
<option value="green">Green</option>
<option value="orange">Orange</option>
<option value="purple">Purple</option>
<option value="red">Red</option>
</select>
<label>Color Lines</label>
<select id="Lines_Color">
<option value="grey">Grey</option>
<option value="black">Black</option>
<option value="blue">Blue</option>
<option value="cyan">Cyan</option>
<option value="green">Green</option>
<option value="orange">Orange</option>
<option value="purple">Purple</option>
<option value="red">Red</option>
</select>
<input type="button" value="Click here" onClick="ShowAndHide('sensor_tab');"/>
</div>
</div>
<DIV id="bar_div" style="position:absolute;display:none; left:250px; top:0px; width:350px; height:450px; z-index:100;background-color:white" align="left" valign="top">
<div style="width: 150px; float: left;">
<label>Shadow :</label>
<label>     Offset right: </label><input style="width:40px" type="text" id="Shadow_dx" tabindex="1" value="" title="offset to the right">
<label>     Offset down: </label><input style="width:40px" type="text" id="Shadow_dy" tabindex="1" value="" title="the offset down">
<label>     Width:  </label><input style="width:40px" type="text" id="Shadow_dw" tabindex="1" value="" title="the width of the shadow line">
<label>Gap</label>
<input style="width:80px" type="text" id="Gap" name="Gap" tabindex="1" value="" title="spacing between your bars or columns">
<label>Color Area</label>
<select id="Area_Color">
<option value="grey">Grey</option>
<option value="black">Black</option>
<option value="blue">Blue</option>
<option value="cyan">Cyan</option>
<option value="green">Green</option>
<option value="orange">Orange</option>
<option value="purple">Purple</option>
<option value="red">Red</option>
</select>
<label>Color Lines</label>
<select id="Lines_Color">
<option value="grey">Grey</option>
<option value="black">Black</option>
<option value="blue">Blue</option>
<option value="cyan">Cyan</option>
<option value="green">Green</option>
<option value="orange">Orange</option>
<option value="purple">Purple</option>
<option value="red">Red</option>
</select>
<input type="button" value="Click here" onClick="ShowAndHide('sensor_tab');"/>
</div>
</div>
<DIV id="torta_div" style="position:absolute;display:none; left:250px; top:0px; width:350px; height:450px; z-index:0;background-color:white" align="left" valign="top">
<div style="width: 150px; float: left;">
<input type="button" value="Click here" onClick="ShowAndHide('sensor_tab');"/>
</div>
</div>
</div>
ho creato una funzione cosi definita:
questa funzione viene chiamata atraverso dei radio buttonCodice PHP:function Change_div(div1,div2,div3){
alert('sono nella change');
el_show=document.getElementById(div1);
el2=document.getElementById(div2);
el3=document.getElementById(div3);
el_show.style.display="block";
el2.style.display="none";
el3.style.dispaly="none";
}
ora la funzione funziona bene tranne per l ultimo che nn funziona e nn capisco perche....Codice PHP:
<DIV id="chart_div" style="position:absolute; left:700px; top:5px; width:400px; height:800px; z-index:0" align="left" valign="top">
<h2>Choice Graph</h2>
<div id="Markschart" style=" width: 250px; height: 150px;"></div>
<input type="radio" name="Radio_Chart" value="Marks_Chart" onClick="Change_div('marker_div','torta_div','bar_div');"checked="checked"/> Markers Chart</p>
<div id="Barschart" style=" width: 250px; height: 150px;"></div>
<input type="radio" name="Radio_Chart" value="Bar_Chart" onClick="Change_div('bar_div','marker_div','torta_div');" /> Bar Chart</p>
<div id="Columnschart" style=" width: 250px; height: 150px;"></div>
<input type="radio" name="Radio_Chart" value="Columns_Chart" onClick="Change_div('bar_div','marker_div','torta_div');"/> Columns Chart</p>
<div id="Piechart" style=" width: 250px; height: 150px;"></div>
<input type="radio" name="Radio_Chart" value="Pie_Chart" onClick="Change_div('torta_div','marker_div','bar_div');"/> Pie Chart</p>
</DIV>
Rispondi quotando