JQuery.show () does not show div with hidden visibility

Question

The main jQuery question:

I am trying to show a div that has been marked as hidden using jQuery. But I do not quite understand him

I created a JSFiddle here: http://jsfiddle.net/VwjxJ/

Basically, I want to use style="visibility: hidden;" , not style="display: none;" , since I want the hidden element space to be supported

Tried to use show() , fadeIn() , etc., but do not work (they do for style="display: none;" )

what am I doing wrong?

Answer 1

If you hid it with visibility:hidden , you can show it with jQuery

 $(".Deposit").css('visibility', 'visible'); 

And in the fiddle you are missing jQuery. Here is a demo: http://jsfiddle.net/9Z6nt/20/

Answer 2

According to the JQuery documentation .show() "is roughly equivalent to calling .css('display', 'block') , except that the display property is restored to what it was originally." Set the style instead. You can use CSS class

 .hidden{ visibility: hidden; } .shown{ visibility: visible; } 

and set uses

 $("#yourdiv").removeClass("hidden").addClass("shown"); 

Answer 3

If you want hidden element space to be supported, use opacity.

i.e:

 $('div').fadeTo(500,1) //show $('div').fadeTo(500,0) //hide 

eg:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div style='opacity:0'> Test opacity </div> <button onclick="$('div').fadeTo(500,1);">Show</button> <button onclick="$('div').fadeTo(500,0);">Hide</button> 

Answer 4

Here we go:)

 $(".Deposit").show(); $(".Deposit").fadeOut(500,function(){ $(this).css({"display":"block","visibility":"hidden"}); }); 

Answer 5

Hey, your violin is working, just select the jQuery framework on the violin. If its visibility is hidden, change the css visibility property to visible.

(".Deposit").css('visibility','visible');

Answer 6

 $(".Deposit").show(); $(".Deposit").fadeTo(500,0);