jQuery 淡入淡出()显示无
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6446176/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery fadeIn() on display none
提问by automaton
I have a div where I did a $('#div').css('display', 'none');
我有一个 div 在那里我做了一个 $('#div').css('display', 'none');
Now, to bring this item back, I want to fade it in. However, it seems like $('#div').fadeIn()
is not doing it, but I don't want to set display back to block, as if I do it just re-appears instantly instead of fading.. any ideas?
现在,为了把这个项目带回来,我想把它淡入。然而,似乎$('#div').fadeIn()
没有这样做,但我不想将显示设置回阻止,好像我这样做只是立即重新出现而不是褪色..有什么想法吗?
回答by Felix Kling
Try
尝试
$('#div').hide();
to hide the element.
隐藏元素。
Update:I suggested this because I came a problem with setting .css('display', 'none')
on the body
in Firefox. But it should work for other elements.
更新:我建议这样做是因为我在 Firefox 中设置.css('display', 'none')
时遇到了问题body
。但它应该适用于其他元素。
But if it does not work with hide()
then you definitely have another problem and you have to post more code or provide a demo.
但是,如果它不起作用,hide()
那么您肯定会遇到另一个问题,您必须发布更多代码或提供演示。
In which browser does it fail? Are you sure $('#div').fadeIn()
is executed?
它在哪个浏览器中失败?你确定$('#div').fadeIn()
被执行了?
回答by Ash
4 years too late but im hoping this will at least help someone out.
4 年太晚了,但我希望这至少能帮助某人。
You need to first change the CSS class using jquery to visibility:hidden
and then apply the fade in function. You can chain these within the same function or run them seperately. Either way you should see the element just fade back into existance as expected.
您需要首先使用 jquery 更改 CSS 类visibility:hidden
,然后应用淡入功能。您可以将它们链接到同一个函数中或单独运行它们。无论哪种方式,您都应该看到元素按预期逐渐恢复存在。
回答by Jose Faeti
Try
尝试
$('#div').hide();
instead of
代替
display:none;
回答by Enes Tanr??ver
Just add speed option;
只需添加速度选项;
$('#div').fadeIn(1000);
It working for me...
它对我有用...
回答by Kai Noack
I had a similar problem caused by CSS set to the element and its :hover
state.
我有一个由 CSS 设置为元素及其:hover
状态引起的类似问题。
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
I removed those lines above and finally jquery's fadeIn()
worked flawlessly.
我删除了上面的那些行,最后 jqueryfadeIn()
完美地工作了。
Also make sure that you do not use display:none !important;
还要确保你不使用 display:none !important;
And yes, you only need to set CSS display:none;
and then use fadeIn()
.
是的,您只需要设置 CSS display:none;
,然后使用fadeIn()
.