如何使这个脚本变成淡入淡出的动画

-1

有人可以帮助我如何使这个淡入淡出的动画，而不是简单的幻灯片效果。我是新手，当它在JavaScript中。我无法弄清楚如何在淡入淡出动画中做到这一点。我喜欢这个剧本，因为它很简单。如果有任何这样的jQuery，请分享。以下是我在下面找到的代码。感谢提前:)如何使这个脚本变成淡入淡出的动画

<html> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<style> 
body{ 
background-repeat: no-repeat; 
background-position: 50 50; 
} 
</style> 
<script > 
//Specify background images to slide 
var imgs=new Array() 
imgs[0]="http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-1.jpg"; 
imgs[1]="http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-2.jpg"; 
imgs[2]="http://buildinternet.s3.amazonaws.com/projects/supersized/3.2/slides/kazvan-3.jpg"; 
//Specify interval between slide (in miliseconds) 
var speed=3000 
//preload images 
var processed=new Array() 
for (i=0;i<imgs.length;i++){ 
processed[i]=new Image(); 
processed[i].src=imgs[i]; 
} 
var inc=-1; 
function slideimg(){ 
if (inc<imgs.length-1) 
inc++; 
else 
inc=0; 
document.body.background=processed[inc].src; 
setTimeout(function(){ 
     slideimg(); 
    }, speed); 
} 

window.onload = function() { 
    slideimg(); 
}; 
</script> 
</head> 
<body> 
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="table1" height="381"> 
    <tr> 
     <td> 
      <p>This is just dummy text</p> 
      <p>This is just dummy text</p> 
      <p>This is just dummy text</p> 
      <p>This is just dummy text</p> 
     </td> 
    </tr> 
</table> 

</body> 
</html>

来源

2013-03-19 user2187151

个人而言，我会使用jQuery使它更容易些代码和跨浏览器兼容。 – j08691 2013-03-19 16:08:08

不是一个真正的答案，所以只需添加评论，但只是谷歌“淡入淡出的动画JavaScript”。这里是我发现的第一个教程：http://tech.pro/tutorial/725/javascript-tutorial-simple-fade-animation – 2013-03-19 16:13:15

通常，我不会通过链接到jQuery来回答问题，但由于您的脚本甚至没有开始褪色的任务，我认为这是正确的方向。 – iGanja 2013-03-19 16:17:51

做在JavaScript淡入是不可能的，但已经做了几百次的地方，你不应该花时间重新发明的地步。我建议你通过一个简单的搜索选择一个淡入淡出的脚本，并解构它，如果你真的想知道它是如何工作的，或者只是使用jQuery来做到这一点。就我个人而言，我认为jQuery是炸弹diggadity。

jQuery Fades

来源

2013-03-19 16:15:37 iGanja

如何使这个脚本变成淡入淡出的动画

回答

相关问题