Page 1 of 1

jQuery show/hide

Posted: Thu Sep 27, 2007 10:27 am
by GeXus
Does anyone happen to know a jQuery show/hide div script..... THAT will hide the div if you click anywhere outside... So for example.. You click a button, it shows the div... if you click anywhere else on the page, it then hides that div...

I could add an event to the body, but i don't know if thats the cleanest way..

Posted: Thu Sep 27, 2007 10:45 am
by pickle
I'm not sure there's any other way. You could add the event to the body only when the div has been clicked however, which will clean it up a bit.

Not sure how to do this with jQuery specifically - I'd use DOM personally.

Posted: Thu Sep 27, 2007 12:28 pm
by GeXus
Yeah, i think that's what i'll.... jquery owns!

Posted: Thu Sep 27, 2007 4:24 pm
by JAB Creations
Why use jQuery for something so simple?

Code: Select all

// setStyleById: given an element id, style property and 
// value, apply the style.
// args:
//  i - element id
//  p - property
//  v - value
//
function setstylebyid(i, p, v)
{
 var n = document.getElementById(i);
 n.style[p] = v;
}
//
// The function is below
//
function divshow() {setstylebyid('your_id_here', 'display', 'block');}
function divhide() {setstylebyid('your_id_here', 'display', 'hide');}
XHTML elements with triggering event...

Code: Select all

<span onclick="divshow();" onkeypress="divshow();">show div</span>
<br />
<span onclick="divhide();" onkeypress="divhide();">hide div</span>

Posted: Thu Sep 27, 2007 7:49 pm
by s.dot
JAB Creations wrote:Why use jQuery for something so simple?
It gets even easier with jQuery. ;)

Code: Select all

$('#element').hide();

Posted: Thu Sep 27, 2007 10:41 pm
by Kieran Huggins
there would be lots of great examples of this in the various jQuery lightbox clones. Check it out!

Posted: Fri Sep 28, 2007 4:40 pm
by GeXus
Kieran Huggins wrote:there would be lots of great examples of this in the various jQuery lightbox clones. Check it out!
Ah thats a good idea, thanks!