1
这个帖子的关注与我以前的帖子：GIFs changing randomly随机动画GIF格式改变
我旁边有3个彼此不同的动画。每一个都由不同的GIF组成，这些GIF是相互随机显示的。所以我为此写了html，但在这种情况下，只有第三个动画发生了变化，其余动画始终保持不变。对此有何想法？ @Ismael米格尔
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link href="styles/styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
window.onload = function() {
var images = [
{src:'bilder/1/1.gif',delay:3500},
{src:'bilder/1/2.gif',delay:1400},
{src:'bilder/1/3.gif',delay:4000},
],
element = document.images['wechsel1'],
change_image = function() {
var image = images[ Math.floor(Math.random() * images.length) ];
// (Math.random()*images.length)>>0 would be a lot faster
element.src = image.src;
setTimeout(change_image, image.delay);
};
setTimeout(change_image);
};
//-->
<!--
window.onload = function() {
var images = [
{src:'bilder/2/1.gif',delay:1800},
{src:'bilder/2/2.gif',delay:1800},
{src:'bilder/2/3.gif',delay:1800},
],
element = document.images['wechsel2'],
change_image = function() {
var image = images[ Math.floor(Math.random() * images.length) ];
// (Math.random()*images.length)>>0 would be a lot faster
element.src = image.src;
setTimeout(change_image, image.delay);
};
setTimeout(change_image);
};
//-->
<!--
window.onload = function() {
var images = [
{src:'bilder/3/1.gif',delay:4300},
{src:'bilder/3/2.gif',delay:3100},
{src:'bilder/3/3.gif',delay:4100},
],
element = document.images['wechsel3'],
change_image = function() {
var image = images[ Math.floor(Math.random() * images.length) ];
// (Math.random()*images.length)>>0 would be a lot faster
element.src = image.src;
setTimeout(change_image, image.delay);
};
setTimeout(change_image);
};
//-->
</script>
</head>
<body>
<div class="center">
<div class="item top">
<img id="wechsel1" src="bilder/1/1.gif" width="568" height="800" border="0" alt="">
</div>
<div class="item">
<img id="wechsel2" src="bilder/2/1.gif" width="568" height="800" border="0" alt="">
</div>
<div class="item bottom">
<img id="wechsel3" src="bilder/3/1.gif" width="568" height="800" border="0" alt="">
</div>
</div>
</body>
</html>
我建议打印“Math.floor（Math.random（）* images.length）”的值，这在第一眼看来似乎是个问题。在脚本中使用html注释标记似乎有点奇怪......这是否有效？ – Roberto
@Robert这是因为（在上一个问题中，O.P.问）他试图创建1个元素，我只是给'window.onload'分配了一个函数。 O.P.重复了代码，每次他分配一个新的函数。这就是为什么它只能在最后一个工作。 –
@Robert就像Ismael Migeul所说的，每次你调用'window.onload ='时，你都在为'window'对象的'onload'事件分配一个事件处理程序......这意味着，你正在*替换先前分配的事件处理程序（导致只有最后一个执行）。为了你的目的，你只需要做一次任务* – wahwahwah