The Easiest method would be to create a "wrapper" div that takes up
the entire screen and assign an "onClick" event to that, which would
then contain the other div. For example:
<div id="wrapper">
<div id="divLoginBox1">
Login box content
</div>
</div>
The CSS for the DIV id="wrapper" would be something like:
#wrapper {
position:absolute;
height:100%;
width: 100%;
}
Then the JS would be:
$("#wrapper').click(function() { $('#divLoginBox1').hide(); });
That should do it. You could leave the #wrapper background
transparent or add in some opacity to a background color to emulate a
"faded" effect to the page content. I believe this is similar to how
well established libraries like "thickbox" handle the same
functionality.
On May 1, 11:14 am, Aleksandr <[EMAIL PROTECTED]> wrote:
> Yes you right.
> Also I have close link inside of the div.
> Everything is working, only outside click left.
>
> On May 1, 3:08 pm, Wes Duff <[EMAIL PROTECTED]> wrote:
>
> > Let me see if I have this clear. Once I do I will write you up a
> > script.
>
> > When someone clicks a link "<a href="#">Show Login Box</a>" you want
> > to display a div that shows the login box.
>
> > When someone clicks somewhere else on the screen and not on the link
> > you want to hide the login box?
>
> > On May 1, 5:08 am, Aleksandr <[EMAIL PROTECTED]> wrote:
>
> > > I still have the same issue.
> > > Yes, I have wrapper div how it can be solved in this case?
>
> > > Thanks
>
> > > On Apr 30, 7:05 pm, Wes Duff <[EMAIL PROTECTED]> wrote:
>
> > > > Off the top of my head --- Try something like this
>
> > > > $('div#mydiv').clcik(function(){$('div#mydiv').show();}); //click to
> > > > show div
> > > > $('div:not(#mydiv)').click(function(){$('div#mydiv').hide()}); click
> > > > anywhere else to hide div ## Problem just thought of If you are using
> > > > a wrapper div then you will have the same problem as before. Well you
> > > > get the idea.
>
> > > > This is just off the top of my head but if it donst work you get the
> > > > idea.
>
> > > > On Apr 30, 11:17 am, Aleksandr <[EMAIL PROTECTED]> wrote:
>
> > > > > Hi All,
>
> > > > > I am showing a div on click of a hyperlink. Now, when i click
> > > > > elsewhere in
> > > > > the document other than the div itself, then i want to hide the
> > > > > showing
> > > > > div... Is there any easy way to do this?
>
> > > > > I've already try:
>
> > > > > $('html').click(function() { $('#divLoginBox1').hide(); });
>
> > > > > and
>
> > > > > $('body').click(function() { $('#divLoginBox1').hide(); });
>
> > > > > but this close div when clicked inside of it.
>
> > > > > Thanks,
> > > > > Alex
