Need a little help with tutorial

@skywalker2208Apr 14.2010 — #Can you provide a link or can you post the code?

@bgreer5050authorApr 14.2010 — #<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Hidden Div</title>

<style type="text/css">

#main{

width:500px; 
 
  height: 20px; 
 
  background: lightblue;

}

#hidden {

width:300px; 
 
  height:20px; 
 
  background: lightgrey; 
 
  display: none;

}

#note {

margin: 10px;
  }

</style>

<script language="JavaScript">

function toggle(id) {

var state = document.getElementById(id).style.display;

if (state == 'block') {

document.getElementById(id).style.display = 'none';

} else {

document.getElementById(id).style.display = 'block';

}

}

</script>

</head>

<body>

<div id="main">This is not hidden.

<a href="#" onclick="toggle('hidden');">Toggle Div</a>

</div>

<div id="hidden">This is hidden.

<ol>

<li>Diss</li>

<li>Div</li>

<li>Test1</li>

<li>Test2</li>

<li></li>

<li></li>

<li></li>

<li></li>

</ol>

</div>

<div id="note" style="margin: auto">This is hidden.

<ol>

<li>Diss</li>

<li>Div</li>

<li>Test1</li>

<li>Test2</li>

<li></li>

<li></li>

<li></li>

<li></li>

</ol>

</div>

</body>

</html>

@bgreer5050authorApr 15.2010 — #I really need help understanding why this is working as it is.

@skullsnestApr 21.2010 — #Your only allowing that div to have 20px of height, which is all it's registering. take out the

just take out the

height: 20px

and you should be fine.

Need a little help with tutorial

4 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Need a little help with tutorial

4 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #JavaScript _↴