Div重叠与datepicker

时间:2014-09-14 10:33:47

标签: html css z-index

我有2个div。

第一个是一个datepicker div,在它下面我有一个图形。当我尝试选择一个日期时,由于这两个div的重叠,datepicker不起作用。我想在图div上压制datepicker。

//here is image
http://tinypic.com/r/1549hlz/8




<div id="cal" name="cal"  align="center" style="align: center; float: center; padding-    right: 150px;" >
<form    name="form" method="post">
<span >From</span> <input type="text" name="date_from" id="date_from"    onclick="setSens('date_to', 'max');" readonly="true">
<span >Till</span> <input type="text" name="date_to" id="date_to"   onclick="setSens('date_from', 'min');" readonly="true"> &nbsp; &nbsp; &nbsp;
<input name="submit"  onclick="show6(); update6();" type="submit"  id="submit"    value="Akım">&nbsp; &nbsp; &nbsp;<input name="submit"  onclick="show6(); update8();"      type="submit"  id="submit" value="Güç">
 </form>
 </div> 


<div id="graph3"  name="graph3"   align="center" style="display:none;width:1000px;height: 250px;">Akım-Zaman Grafiği</div><br/><br/><br/>

<script type="text/javascript">


 function update6(){
     graph drawing.....
 }
</script>

<script type="text/javascript">


 function update8(){
    another graph drawing..... (not important for  the case)
 }
 </script>


<script>
 function show6(){
document.getElementById("graph3").style.display = 'block';
document.getElementById("cal").style.display = 'block';
}
</script>

1 个答案:

答案 0 :(得分:0)

你还没有清理你的漂浮物。

将它放在DIV&#39>之间

    <div id="clear" style="clear:both;"></div>

所以......

<div id="cal" name="cal"  align="center" style="align: center; float: center; padding-    right: 150px;" >
<form name="form" method="post">
<span >From</span> <input type="text" name="date_from" id="date_from"    onclick="setSens('date_to', 'max');" readonly="true">
<span >Till</span> <input type="text" name="date_to" id="date_to"   onclick="setSens('date_from', 'min');" readonly="true"> &nbsp; &nbsp; &nbsp;
<input name="submit"  onclick="show6(); update6();" type="submit"  id="submit"    value="Akım">&nbsp; &nbsp; &nbsp;<input name="submit"  onclick="show6(); update8();"      type="submit"  id="submit" value="Güç">
</form>

    <div id="clear" style="clear:both;"></div>

</div>  

<div id="graph3"  name="graph3"   align="center" style="display:none;width:1000px;height: 250px;">Akım-Zaman Grafiği</div>

<br/><br/><br/>

P.S。无需声明类型=&#34; text / javascript&#34;很好。所有三个脚本只需要一组标签。

'<script>
 function update6(){
     graph drawing.....
 }

 function update8(){
    another graph drawing..... (not important for  the case)
 }

function show6(){
document.getElementById("graph3").style.display = 'block';
document.getElementById("cal").style.display = 'block';
}

</script>'