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