Vinz' Blog

"Code, Beer and Music" ~ my way of being a programmer!
posts - 124, comments - 366, trackbacks - 0

My Links

News

Archives

Image Galleries

Hide Panel When Clicking Anywhere in the Page

This example shows how to hide a Div when clicking anywhere the page:

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

<head runat="server">

    <title>Untitled Page</title>

      <script type="text/javascript" language="javascript">

        function HideDiv()

        {

             document.getElementById("ContainerDiv").style.display = 'none';

             return false;

        }

        function ShowDiv(e)

        {

            document.getElementById("ContainerDiv").style.display = 'block';

            if(!e)

            e=window.event;

            e.cancelBubble=true;

            return false;

        }

    </script>

</head>

<body onclick="return HideDiv();">

    <form id="form1" runat="server">

    <asp:Button ID="Button1" runat="server" Text="Show Div" OnClientClick="return ShowDiv(event);" />

      <div id="ContainerDiv"

       style="width:521px;

              height:200px;

              background-color:Gray;

              left:150px;

              position:absolute;

              top: 201px;

              display:block"

              align="center"

              onclick ="return ShowDiv(event);">

       HELLO ASP.NET

       <br />

       <asp:TextBox ID="TextBox1" runat="server" onclick = "return ShowDiv(event);"></asp:TextBox>

      </div>

    </form>

</body>

</html>


That's it!

Print | posted on Sunday, October 18, 2009 2:22 PM |

Feedback

No comments posted yet.
Post A Comment
Title:
Name:
Email:
Website:
Comment:
Verification:
 
 

Powered by: