[英]I want to repeat code but don't know how t use loops
I have this code: 我有以下代码:
js: js:
function change_color(color) {
$("body").animate({ backgroundColor:color }, '1000');
}
setTimeout(function () {
change_color('#4AC900'
);
}, 500);
setTimeout(function () {
change_color('#964514'
);
}, 1500);
setTimeout(function () {
change_color('#EE0000'
);
}, 1500);
setTimeout(function () {
change_color('#FFE303'
);
}, 1500);
setTimeout(function () {
change_color('#8E388E'
);
}, 1500);
setTimeout(function () {
change_color('#FF00AA'
);
}, 1500);
and I want to use it repeatedly but putting it in a while loop just crashes the site can anyone help? 并且我想重复使用它,但是将其置于while循环中只会使网站崩溃,任何人都可以帮忙吗?
Here is the site... its my little brothers site not mine... http://timothy.techbytbone.com/isaac.php 这是网站...它是我的弟弟网站而不是我的网站... http://timothy.techbytbone.com/isaac.php
var colors = ['#4AC900', '#964514', '#EE0000', '#FFE303', '#8E388E', '#FF00AA'],
len = colors.length,
i;
for (i = 0; i < len; i++) {
(function(i, color) {
setTimeout(function () {
change_color(color);
}, (i + 1) * 500);
})(i, colors[i]);
}
this is all you need: 这就是您所需要的:
var c = 0;
var colors = ['#4AC900','#964514','#EE0000','#FFE303','#8E388E','#FF00AA'];
(function loop(){
$('body').stop().animate({backgroundColor : colors[c++%colors.length] }, 1000, loop);
})();
(Prest attention that you need to use the jQuery UI to animate the CSS background-color
property) (请注意,您需要使用jQuery UI来为CSS background-color
属性设置动画)
var colors = {'#4AC900': 500,
'#964514': 1500,
// etc. Just continue with the color-millisecond combinations
}
for(key in colors) {
setTimeout(function () {
change_color(key);
}, colors[key]);
}
Your loop is crashing because you can't set all the necessary timeouts at browser's loading. 由于无法在浏览器加载时设置所有必需的超时,因此循环崩溃。 Here is a version of your code that should work. 这是应该工作的代码版本。
var colors = ['#4AC900', '#964514', '#EE0000', '#FFE303', '#8E388E', '#FF00AA'];
var currentColorIndex = 0;
var scheduleChange;
scheduleChange = function() {
change_color(currentColorIndex);
currentColorIndex = (currentColorIndex + 1) % colors.length
setTimeout(scheduleChange, 1000);
};
setTimeout(scheduleChange, 500);
function change_color(color) {
$("body").animate({ backgroundColor:color }, '1000');
}
setTimeout(function() {
change_color('#4AC900')
}, 500);
colors = ['#964514', '#EE0000', '#FFE303', '#8E388E', '#FF00AA']
interval = setInterval(function() {
if (! a.length) {
return clearInterval(interval);
}
change_colors(a.shift());
}, 1500);
Have Fun. 玩得开心。 You should learn about closures for not messing setIntervals. 您应该了解不使setIntervals混乱的闭包 。 There are tons of libraries that animate colors and other stuff. 有大量的库可以对颜色和其他内容进行动画处理。 I can recommend morpheus by ded . 我可以通过ded推荐语素 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.