所以。我一直在尝试创建一段简单的文本，当页面加载时会淡入。我已经探索了很多关于堆栈溢出的消息，也考虑过这个：
http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_fadein
我甚至考虑过使用window.onload，更不用说这个了：
<body onload="$("#fadein p.desktoptheme").delay(1000).animate({"opacity": "1"}, 700);">
但是淡入不会起作用。文本从不显示。
我将元素的不透明度设置为0（使用CSS）。
<script type="text/javascript">
$("#fadein p.desktoptheme").delay(1000).animate({"opacity": "1"}, 700);
</script>
还有一件事：放置在<p class="desktoptheme"></p>标记中的文本是用PHP生成的。可能是PHP是服务器端，而JavaSciprt是客户端。如果是，我该用什么？延期？异步传输
有什么想法吗？
使用jQuery时，您总是希望将DOM操作代码放入jQuery的.ready(function())中，否则您的代码将在页面成功加载之前激发
示例：
<script type="text/javascript">
$( document ).ready(function() {
$("#fadein p.desktoptheme").delay(1000).animate({"opacity": "1"}, 700);
});
</script>
为了获得更优雅的解决方案，您还可以考虑使用CSS动画来获得相同的效果。查看此链接，了解有关使用CSS淡入元素的更多信息。
要将服务器端内容放置在用PHP渲染的页面中，只要在加载页面之前文本可用，您只需要将变量与HTML混合回显即可。
示例：
<p class="desktoptheme"><?php echo "Hello world"; ?></p>
当javascript运行时，用PHP粘贴在元素内部的任何文本都已经存在了——正如您所说，PHP是服务器端，javascript是客户端。所以你不需要担心。
我看到您正在使用jQuery，所以您应该查看$(document).ready()。该函数在页面加载完成后执行一些javascript。例如：
JS:
$(document).ready(function() {
$('.fadein').animate({'opacity' : 1}, 700);
})
HTML:
<p class='fadein'>
This is some text that will fade in.
</p>
CSS：
.fadein {
opacity: 0;
}
这是一个JSFiddle，所以你可以玩更多。请注意，段落的类（fadein）必须与jQuery选择器$('.fadein')和css选择器.fadein相匹配。
Fiddle
我有一个函数可以做到这一点。它看起来有点像jQueryfade（），但它是标准的JavaScript，可以与完成时回调函数一起使用，也可以不使用。
/* fade.In(), fade.Out():
el = element object
dur = duration milliseconds
fn = callback function
*/
var fade = {
In: function(el, dur, fn) {
var time = Math.round(dur / 10);
function fader(t, e, v) {
if (v < 1) {
e.style.opacity = v;
setTimeout(function () {
fader(t, e, parseFloat((v += 0.1).toFixed(2)));
}, t);
} else {
e.style.opacity = '1';
if (fn) fn();
}
}
if (el.style.display === 'none') el.style.display = 'block';
el.style.opacity = '0';
fader(time, el, 0);
},
Out: function(el, dur, fn) {
var time = Math.round(dur / 10);
function fader(t, e, v) {
if (v > 0) {
e.style.opacity = v;
setTimeout(function () {
fader(t, e, parseFloat((v -= 0.1).toFixed(2)));
}, t);
} else {
el.style.opacity = '0';
e.style.display = 'none';
if (fn) fn();
}
};
fader(time, el, 1);
}
};
/* Usage */
var elem1 = document.getElementById('id1');
var elem2 = document.getElementById('id2');
// fade in with callback
fade.In(elem1, 500, function() {
// ... do something after fade in ...
});
// fade out without callback
fade.Out(elem2, 666);
最适用于相对快速的转换：c.500ms+|-200（ish）。
出于您的目的，只需在页面加载时对所选元素调用fade.In()函数。
希望能有所帮助。：）
查看animate.css。把这个放在你的脑海里：
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.1/animate.css">
然后添加
中的动画音量
给你的班级：
<p class="desktoptheme animated fadeIn"></p>
如果您想在滚动到元素时使其动画化，请查看WOW.js
我强烈建议使用名为velocity的js库来帮助制作css动画。
如果我跟对你，它会是这样的。。。
css
p.desktoptheme {
display: none;
opacity: none;
}
jquery
$(function(){
$('p.desktoptheme').velocity('fadeIn', {
'duration': 300,
'delay': 1000,
'complete': function(){
// all done!
}
});
});