jquery fadeIn将不透明度保留为0

Question

我对.fadeIn()

有这种奇怪的行为

如果我写

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

div显示得很好。

但是，如果我写

$('#MyDiv').fadeIn(400);

div显示但不透明0！

之前的行是：

$('#MyDiv').hide()
    .html(TheHTML)
    .css('top', 0);

更新：如果我写$('#MyDiv').show(400);

div也保持不透明度0。

Answer 1

有些CSS在隐藏时会覆盖你的div ..更好地将div的不透明度样式添加为100。

其他，

$('#MyDiv').css('opacity','100');

在您的淡入淡出呼叫后

Answer 2

尝试jQuery .fadeTo功能。

.fadeTo( duration, opacity [, callback] )  
.fadeTo( duration, opacity [, easing] [, callback] )  

示例：

$('#book').fadeTo('slow', 0.5, function() {
  // Animation complete.
});

Answer 3

以下内容将使其显示为您想要的

$('#MyDiv').animate({
  opacity: 1
},400);

您可以尝试以下操作：

$('#MyDiv').fadeIn(400, function(){
    $(this).css('opacity', 1)
});

<强> DEMO

但我认为你的工作也应该没问题。请参阅 here

Answer 4

检查您是否有

opacity: 0 !important;

//or

opacity: 0;

在你的css中，你必须自己手动更改opacity

$('#MyDiv').fadeIn(400,function(){
   $(this).css('opacity',1);
});

检查fiddle。第一个div永远不会出现。