CODEWITHSUNDEEP
javascriptjquery
Tim
Tim

Reputation: 13258

jQuery -> check the visibility of an element

I have a div element which will be shown/hidden in many places. Is it possible if I do a 

$("#divtobetracked").hide();

or a 

$("#divtobetracked").show();

that another action is fired? Because if .hide() of the element, a button should also be hidden, and if the element wil be shown, a button should also be displayed.

So, I think I can write a function which toggle and do the things I want and I call the function if I want to show/hide the element.

But, is there another possibility, sth. like a .live() event?

Best Regards.

Upvotes: 2

Views: 5245

Answers (4)

Spiny Norman
Spiny Norman

Reputation: 8327

No, that doesn't exist. You could write a function, like you mentioned, or you could extend jquery, like this (see also http://docs.jquery.com/Plugins/Authoring):

(function( $ ) {

  $.fn.hideMe = function() {
     this.hide();  

     this.each(function() {
         // Do more stuff here.
     });

     // Maybe even:
     this.trigger('hideMe.hidden');
  };
})( jQuery );

Then substitute your old .hide() call for: 

$('#divtobetracked').hideMe();

And, if you also included the "trigger" call, you can now do:

$('#divtobetracked').bind('hideMe.hidden', function() {
    // do some specific stuff for this div here, like:
    $('#somebutton').hide();
});

See also: http://api.jquery.com/trigger/.

Or, if all you really want to do is hide a div and a button at the same time, just give them the same class:

<div id='#divtobetracked' class='hide-me'></div>
<button id='#somebutton' class='hide-me'></button>

and then

$('.hide-me').hide();

Upvotes: 2

Vivek
Vivek

Reputation: 11028

read this discussion...it will help you...
check visibility of element

and try this also... 

if(  $(element).is(":visible") == "true" ){  // do something }

else{ // do something else<br> }

Upvotes: 5

Rafay
Rafay

Reputation: 31033

$("#divtobetracked").toggle();

hope this helps

Upvotes: 0

Coroos
Coroos

Reputation: 390

You could use the callback argument to .hide() and .show() to call .trigger(). See http://api.jquery.com/hide/ and http://api.jquery.com/trigger/ .

$($('#divtobetracked').bind('hideandshow', function() {
  alert('divtobetracked was hidden or shown');
});
$("#divtobetracked").hide(function () {
  $("#divtobetracked").trigger('hideandshow');
});

Upvotes: 1

Related Questions