Show/ Hide div?

Question

sarithak 0 Junior Poster

14 Years Ago

Hi frnds,

I m using the below code...it is working fine...nothing prob in it..

just i want change the visibility of that div....here by default div is visible...but i want default div should be hidden.....plz look into the below code..

<html>
<head>
 
    <script language="javascript" type="text/javascript">
    function showHideDiv()
    {
        var divstyle = new String();
        divstyle = document.getElementById("div1").style.visibility;
        if(divstyle.toLowerCase()=="visible" || divstyle == "")
        {
            document.getElementById("div1").style.visibility = "hidden";
        }
        else
        {
            document.getElementById("div1").style.visibility = "visible";
        }
    }
    </script>   
</head>

<body>

    <div id="div1" class="divStyle">
        Show Hide Div 
    </div>
    
    <center>
      <a href="#" onclick="showHideDiv()" >Click Here</a>
    </center>
	
	
    
</body>
</html>

javascript

4 Contributors
3 Replies
223 Views
8 Hours Discussion Span
Latest Post 14 Years Ago Latest Post by rajarajan2017

parry_kulk 14 Junior Poster

14 Years Ago

Either set the styles in the css for 'divStyle'
like

<STYLE>
...
...
. divStyle{
     ...
     ...	
     visibility:hidden;    
     ...
     ...
}
....
</STYLE>

Or you can set it in the style attribute of the div element as

<div id="div1" class="divStyle" style="visibility:hidden;">

hope this helps

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Erco21 0 Newbie Poster · Answer 1 · 2010-05-07T14:45:24+00:00

Erco21 0 Newbie Poster

14 Years Ago

try with:

div1.style.display = 'none';

rajarajan2017 · Answer 2 · 2010-05-07T15:18:39+00:00

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<div id='imageSpace'><img src='images/image.jpg'></div>
<input type="radio" name="changer" value="show" onclick="document.getElementById('imagespace').style.display = '';"> Show<br>
<input type="radio" name="changer" value="hide" onclick="document.getElementById('imagespace').style.display = 'none';"> Hide
</body>
</html>