gpt4 book ai didi

javascript - GIF 随机变化

转载 作者:行者123 更新时间:2023-11-30 00:29:33 24 4
gpt4 key购买 nike

我遇到了 GIF 和 Javascript 方面的问题。我得到了不同的 GIF 动画,它们都是相同的格式,我希望它们在播放一次后随机变化。

我试图用 Javascript 解决这个问题,但我只能让它在准确的时间进行更改,而不是在每个 GIF 动画完成时(它们都在不同的时间完成)。

<html>
<head>
<script type="text/javascript">
<!--
var ima = [];

ima[0] = 'bilder/bild1.gif';
ima[1] = 'bilder/bild2.gif';
ima[2] = 'bilder/bild3.gif';
ima[3] = 'bilder/bild4.gif';

function BildWechsel()
{
var num = Math.random();
var ran = Math.floor((ima.length - 1) * num);

document.images['wechsel'].src = ima[ran];
}

onload = function ()
{
window.setInterval(function () { BildWechsel(); }, 10000);
}
//-->
</script>

</head>
<body>

<img id="wechsel" src="bilder/bild1.gif" border="0" alt="">

</body>
</html>

有没有可能使这项工作?如果不在浏览器中,您还能如何让它工作?

最佳答案

我会像这样重写 Javascript:

window.onload = function () {

var images = [
{src:'bilder/bild1.gif',delay:3000},
{src:'bilder/bild2.gif',delay:2000},
{src:'bilder/bild3.gif',delay:1500},
{src:'bilder/bild4.gif',delay:4000}
],
element = document.images['wechsel'],
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, 10000);

};

延迟 会根据您当前拥有的图像而改变。

这有一些速度改进,代码尽可能简单。

这是未经测试的!

这是一个(略微)更改的版本,用于更改文本颜色:

window.onload = function () {

var colors = [
{name:'red',delay:3000},
{name:'yellow',delay:1000},
{name:'green',delay:2300},
{name:'blue',delay:2600},
{name:'pink',delay:1300},
{name:'purple',delay:500},
],
element = document.getElementById('span'),
change_color = function () {
var color = colors[ ( Math.random() * colors.length )>>0 ];

element.style.color = color.name;

setTimeout(change_color, color.delay);
};

setTimeout(change_color, 2000);

};
<span id="span" style="background:black;font-family:sans-serif;font-size:20px;font-weight:bold;padding:10px;">I change color!</span>

关于javascript - GIF 随机变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30130462/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com