CODEWITHSUNDEEP
jquerycss
Sakshi Sharma
Sakshi Sharma

Reputation: 1472

Detecting whether a div is visible or not using jquery

I am trying to determine the visibility of a specific <div>, but my check always shows it as being visible. I am using the following code:

if($('.stg_gall_cro_cnt').is(":visible")) {
    var visi="yes";
} 
else {
    var visi="no";
}
alert(visi);

Every time this check runs, the alert says "yes", even if the <div> is not visible. Can someone help?

The css for the .stg_gall_cro_cnt is set by default to:

visibility:hidden;

Upvotes: 1

Views: 452

Answers (2)

Jordan
Jordan

Reputation: 4628

The :visible selector only matches elements that occupy no space in the rendered document. Elements whose visibility is set to hidden occupy space so jQuery considers them visible.

You need to set display: none in CSS to achieve the desired effect using is(':visible') or use css('visibility') == 'hidden' in jQuery to accomplish it with visibility: hidden.

Upvotes: 2

wanovak
wanovak

Reputation: 6127

if($('.stg_gall_cro_cnt').css('visibility') === 'hidden'){
    // hidden
}else{
    // visible
}

Upvotes: 3

Related Questions