show hide div on click using display none and show onclick

Admin

9 years ago

Working Example:

<html>
<head>
    <title>jQuery show</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.js"></script>
    <script type="text/javascript">
        function Show_Div(Div_id) {
            if (false == $(Div_id).is(':visible')) {
                $(Div_id).show(250);
            }
            else {
                $(Div_id).hide(250);
            }
        }
    </script>
</head>
<body>
    <br />
    <input type="button" value="Click me to show or hidden div" onclick="Show_Div(Div_1)" />
    <br />
    <br />
    <div id="Div_1" style="display: none; background-color: #ffffdd; width: 300px;">
        I am div
    <br />
        Now you can see me.
    </div>
</body>
</html>

<html>

<head>

<title>jQuery show</title>

function Show_Div(Div_id) {

if (false == $(Div_id).is(':visible')) {

$(Div_id).show(250);

}

else {

$(Div_id).hide(250);

}

</script>

</head>

<body>

<br />

<br />

I am div

<br />

Now you can see me.

</div>

</body>

</html>

Source: http://www.learnfast.ninja/posts/53c4e6e004dc4884098cb647