Jquery .show()没有透露具有隐藏可见性的div

Question

基本的jQuery问题:

我试图揭示一个div被jQuery标记为隐藏的东西.但我不太明白

我在这里创建了一个JSFiddle:http://jsfiddle.net/VwjxJ/

基本上,我想使用style="visibility: hidden;"而不是style="display: none;"我想要保持隐藏元素的空间

使用试过show(),fadeIn()等,但没有工作(他们为做style="display: none;")

我究竟做错了什么？

Answer 1

如果您已将其隐藏,visibility:hidden则可以使用jQuery显示它

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

在小提琴中你缺少jQuery.这是一个演示: http ://jsfiddle.net/9Z6nt/20/

Answer 2

根据JQuery文档.show()"大致相当于调用.css('display', 'block'),除了显示属性恢复到最初的状态." 请改为明确设置样式.你可以使用CSS类

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

并设置正在使用

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

Answer 3

如果要保留隐藏元素的空间,请使用不透明度.

即:

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

例如:

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