淡入动画 [英] Fade in Animations
问题描述
所以。我一直在尝试创建一个简单的文本，当页面加载时该文本会淡入。我对Stack Overflow进行了很多探讨，并考虑了以下问题：
So. I've been trying to create a simple piece of text that fades in when the page loads. I've explored a lot hear on Stack Overflow and also considered this:
http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_fadein
I甚至使用window.onload进行了调查，更不用说了：
I even looked into using a window.onload, not to mention this:
<body onload="$("#fadein p.desktoptheme").delay(1000).animate({"opacity": "1"}, 700);">
但是淡入效果不起作用。文本永远不会显示。
But the fade in won't work. The text never displays.
我将元素的不透明度设置为0（使用CSS）。
I have the opacity for the element set as 0 (using CSS).
<script type="text/javascript">
$("#fadein p.desktoptheme").delay(1000).animate({"opacity": "1"}, 700);
</script>
一件烦人的事情：< p class = desktoptheme< / p> 标签是用PHP生成的。可能是PHP在服务器端，而JavaSciprt在客户端。如果是这样，我该怎么用？延迟？ AJAX？
One moar thing: The text that's placed inside the <p class="desktoptheme"></p> tag is generated with PHP. It could be that PHP is server-side while JavaSciprt is client-side. If so, what do I use? A delay? AJAX?
有什么想法吗？
推荐答案
我会高度建议使用名为 velocity 的js库来帮助CSS动画。
I would highly recommend using a js library called velocity to help with css animations.
如果我正确地跟随您，它看起来会像这样...
If I follow you right, it would look something like this...
css
p.desktoptheme {
display: none;
opacity: none;
}
jquery
$(function(){
$('p.desktoptheme').velocity('fadeIn', {
'duration': 300,
'delay': 1000,
'complete': function(){
// all done!
}
});
});
这篇关于淡入动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
