CODEWITHSUNDEEP
javascriptjquerycss
ozil
ozil

Reputation: 7117

Changing visibility property

I have a div which has a class name myClass and id name myId. The div has following style.

.myClass {
    height: 74%;
    margin-top: -1px;
    position: relative;
    overflow-y: auto;
    width: 100%;
    overflow-x: hidden;
    visibility: hidden;
}

When i try to change visibility from hidden to visible doing this

$('#myId').css({ 'visibility': 'visible' });

I am using id in JQuery instead of class because same class is applied to others elements too. My div is still not visible. What am I doing wrong?

Upvotes: 5

Views: 1979

Answers (5)

Mayank
Mayank

Reputation: 1392

just go simple, there is an api available in jquery for hiding and showing up DOM elements. Try as follows

   $('#myId').hide(); // for hiding the element

    $('#myId').show(); // to show up the element

Upvotes: 0

cpVariyani
cpVariyani

Reputation: 159

Yes you can do this by the following ways

$('#myId').css('display','block');

$('#myId').css('display','inline');

$('#myId').show();

Upvotes: 1

dazunE
dazunE

Reputation: 328

in css the visibility property effects to content inside the tag while display property effects to total tag, that means if you apply display:none; it will remove entire tag but visibility:hidden hide the content inside that tag.

Since :visible is a jQuery selector you can use opacity instead of visibility to hide the content inside the tag.

$('#myId').css('opacity','1');
$('#myId').css('opacity','0');

if you need to hide the entire tag, better go with display none

Upvotes: 0

Fergoso
Fergoso

Reputation: 1582

Replace your visibility: hidden; to display: none;

then update jQuery

$('#myId').css('display','block');

Upvotes: 0

DeDevelopers
DeDevelopers

Reputation: 591

Why do not you try :

$('#myId').css('display', 'block');

or Try:

<style>
.visible { display:block !important;}
</style>
$('#myId').addClass('visible');

Upvotes: 0

Related Questions