2

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.

Tim
  • 12,894
  • 35
  • 105
  • 158
  • 1
    You **can't** have multiple elements of the same `id` in the same document; if you *do* then you should be using a `class` instead: `$('.divtobetracked')` in place of `$('#divtobetracked')`. Also, can you take a moment to clarify your question and title? I'm having trouble trying to work out what you're trying to ask. Guidance from [@Jon Skeet](http://msmvps.com/blogs/jon_skeet/archive/2010/08/29/writing-the-perfect-question.aspx). – David says reinstate Monica Jan 11 '11 at 09:14
  • @David Thomas I don't think that's what @Tim means, he means something (ideally) like `$('#divtobetracked').hide(function() {...});`, a sort of "on-hide" or otherwise "on-css-change" feature. He is talking about only one `div`. You're right though, because this doesn't exist, his best bet would probably be to add a class to the div as well as the button, and do a `$('.toggle-elements').hide()` instead. – Spiny Norman Jan 11 '11 at 09:22

4 Answers4

5

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> }

Community
  • 1
  • 1
Vivek
  • 10,426
  • 14
  • 44
  • 65
  • 1
    This is not an answer to the question: it doesn't fire when the element's visibility changes. – Spiny Norman Jan 11 '11 at 09:26
  • It may not be the answer, but I was looking for it for a long time. It can tell if the element is visible and it throws false when the element is not visible or doesn't exist. There are other questions searching for an answer like this. Maybe you could look for them. – Mauricio Moraes Jul 15 '14 at 12:50
2

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();
Spiny Norman
  • 7,974
  • 1
  • 28
  • 53
1

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');
});
Coroos
  • 353
  • 1
  • 9
  • This is pretty smart, but what's the difference between calling it as a callback function and just calling it after the `.hide()` call in this case? The point is to define _once_ what should happen when the element is hidden, not at every call to `.hide()`. – Spiny Norman Jan 11 '11 at 09:29
0
$("#divtobetracked").toggle();

hope this helps

Rafay
  • 30,236
  • 5
  • 64
  • 98