views:

32

answers:

3

I'm trying to figure a way of finding out if a layer is displayed or not

if ($('.property > .evenprop').css('display','block')){
    $('.otherprop').show();
    }
    else {
    $('.otherprop').hide();
    }

So something like if this is true

<div class="property">

<div class="evenprop" style="display:block">blah</div>

</div>

Then show this layer

<div class="otherprop">blahblah</div>

$('.otherprop').show();

Else if this is true

<div class="property">

<div class="evenprop" style="display:none">blah</div>

</div>

Then hide this layer

<div class="otherprop">blahblah</div>

$('.otherprop').hide();

Can't seem to get this to work though any ideas?

Thanks

Jamie

+6  A: 

You're looking for the :visible pseudo-class.

if ($('.property > .evenprop').is(':visible')){
    $('.otherprop').show();
} else {
    $('.otherprop').hide();
}

The above can be reduced to

$('.otherprop').toggle($('.property > .evenprop').is(':visible'));
David Hedlund
Thank you that has been frying my brain all night!
Jamie Taylor
A: 

$('.property > .evenprop').css('display','block') will set the CSS. If you need to check use :visible selector

You can use something like this:

if($('.property > .evenprop :visible').size!=0)

Vikash
A: 

This would work too:

if ($('.property > .evenprop').css('display') == 'block'){ 
    //...
}
Alex