javascript 如何在 display=inline-block 中使用淡入淡出
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6718054/
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
how to use fadeIn with display=inline-block
提问by Itay Moav -Malimovka
I try to fadeIn a div which (should) have a display inline-block.
It seems the fadeIn method assumes only display=block.
Is there a way to change that behavior?
我尝试淡入一个 div，它（应该）有一个显示内联块。
似乎fadeIn 方法只假设display=block。
有没有办法改变这种行为？
回答by Itay Moav -Malimovka
From a combination of what I read above, this is the best I got:
结合我上面阅读的内容，这是我得到的最好的：
$(div).css({
opacity: 0,
display: 'inline-block'
}).animate({opacity:1},600);
回答by Spudley
I'd suggest putting an extra element layer inside the inline-blockelement, and fading that in instead.
我建议在元素内放置一个额外的元素层inline-block，然后淡入淡出。
<div style='display:inline-block;'>
<div id='fadmein'>....</div>
</div>
$('#fademein').fadeIn();
I know it's extra markup, but it's probably the most pragmatic solution to the problem.
我知道这是额外的标记，但它可能是解决问题的最实用的解决方案。
The alternative would be to use JQuery's animate()method to change the opacity, rather than using fadeIn(). This would only change the opacityproperty; so the displayproperty would be untouched.
另一种方法是使用 JQuery 的animate()方法来更改不透明度，而不是使用fadeIn(). 这只会改变opacity属性；因此该display财产将保持不变。
回答by Simeon
According to this questionin the jQuery Forums, the suggested solution is to change its ′display′ property to blockand floating it.
根据jQuery 论坛中的这个问题，建议的解决方案是将其“显示”属性更改为block并浮动它。
