开发者

html toggle divs

i have the following code :

<html>
<head><title></title>
<script>
function showMe (it, box) {
  var vis = (box.checked) ? "none" : "block";
  document.getElementById(it).style.display = vis;
}
</script>
</head>
<body>

<input type="checkbox" name="c1" onclick="showMe('div1', this)">Show Hide Checkbox
<div id="div1">
<h3 align="center"> test </h3>

</div>
<form>
</form>
</body>

I want to toggle the div, the code above works however when the script loads th开发者_高级运维e div is visible. How can i set the div to hidden when the script loads? (i know that if i set the div outside the tags it works however i want to toggle them inside).


Set the div tag to display:none initially. And flip the condition of the if.

Like:

function showMe (it, box) {
    var vis = (box.checked) ? "block":"none";
   document.getElementById(it).style.display = vis;
}


<div id="div1" style="display:none">


I do something very similar on one of my pages and I include this in the div

style="display:none"

That seems to work for me, and then it gets changed to block when i click my show/hide button

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜