Question

我将body标记设置为display:none，而在document.ready中，我执行$('body').fadeIn(1000);。它可以在Chrome上使用，但页面保持display:none。

我的网站是here

Answer 1

如果你想淡入身体，请使用CSS：

@-webkit-keyframes fadeIn {    
    0% { opacity:0; }
    100% { opacity:1; }
}

@-moz-keyframes fadeIn {    
    0% { opacity:0; }
    100% { opacity:1; }
}

@-o-keyframes fadeIn {    
    0% { opacity:0; }
    100% { opacity:1; }
}

@keyframes fadeIn {    
    0% { opacity:0; }
    100% { opacity:1; }
}

然后在你身上的CSS：

body {
    -webkit-animation: fadeIn 1s linear 1; /* Safari & Chrome */
    -moz-animation: fadeIn 1s linear 1; /* Firefox */
    -o-animation: fadeIn 1s linear 1;  /* Opera */
    animation: fadeIn 1s linear 1;
}

除了IE9之外，它将处理所有事情，速度会快得多，并且不会让那些禁用Javascript的人感到困惑。

Answer 2

styles.css和inline都有display:none。

尝试从styles.css文件中删除它，因为它已经内联声明。

Answer 3

正如有人现在已经删除了他们的评论所说的那样，事实就是身体上的事实。我在正文中添加了一个div并在其上应用了样式和jquery，它运行良好。

jQuery fadeIn不在firefox上工作

3 个答案: