Javascript jquery后台未在IE中重复_Javascript_Jquery

Javascript jquery后台未在IE中重复

javascript jquery

Javascript jquery后台未在IE中重复,javascript,jquery,Javascript,Jquery,我有下面的代码。它在safari中运行良好，但在IE中背景仅旋转一次，并在粉红色上停止我错过了什么希望有人能帮忙 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8

我有下面的代码。它在safari中运行良好，但在IE中背景仅旋转一次，并在粉红色上停止

我错过了什么

希望有人能帮忙

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Iridescent Ideas</title>
<style type="text/css">
html, body {height:100%; margin:0; padding:0;}
#page-background {position:fixed; top:0; left:0; width:100%; height:100%;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.js"></script>
</head>
<body>

<center>
<img src="logo.png" alt="Coming Soon" width="557" height="430" border="0" usemap="#Map" style="margin-top:100px;">
<map name="Map">
  <area shape="rect" coords="106,377,454,406" href="mailto:gareth@iridescentideas.com" alt="Email">
</map>
</center>
<script type="text/javascript">  
var colors = Array('#66ccff', '#ff99ff'); //List the hex codes you want to loop through here.
var color_index = 0;
var interval = 5000; //How long the color blend transition lasts. (in milliseconds, 1000 = 1 second)

function bg_color_tween() {
        $('body').animate({ backgroundColor: colors[color_index] }, interval, 'linear', function() {
                if(color_index == colors.length) { color_index = 0; } //If we are at the end of the colors array go back to the beginning.
                else { color_index++; } //Lets move to the next color in the colors array.s

                bg_color_tween();
        });
}

$(document).ready(function() {
        if( $(window).width() > 1024 ) {
                //Kicks off the background color tweening.
                bg_color_tween();
        }
}); 
</script>
</body>
</html>


光彩夺目的想法
html，正文{高度：100%；边距：0；填充：0；}
#页面背景{位置：固定；顶部：0；左侧：0；宽度：100%；高度：100%；}
变量颜色=数组（“#66ccff”、“#ff99ff”）//在这里列出要循环的十六进制代码。
var颜色指数=0；
var区间=5000//颜色混合过渡持续的时间。（以毫秒为单位，1000=1秒）
函数bg_color_tween（）{
$（'body'）.animate（{backgroundColor:colors[color\u index]}，interval，'linear'，function（）{
如果（color_index==colors.length）{color_index=0；}//如果我们位于colors数组的末尾，则返回到开头。
else{color_index++}//让我们移动到colors数组中的下一种颜色
bg_color_tween（）；
});
}
$（文档）.ready（函数（）{
如果（$（窗口）.width（）>1024）{
//启动背景色粗花呢。
bg_color_tween（）；
}
});

在IE9中，它工作正常。应该没有问题。您是在本地环境还是服务器环境中进行测试？

您可以尝试设置超时来稍微延迟动画的执行

function bg_color_tween() {
  $('body').animate({ backgroundColor: colors[color_index] }, interval, 'linear', function() {
    if(color_index == (colors.length-1)) { //If we are at the end of the colors array go back to the beginning.
      color_index = 0; 
    } else { //Lets move to the next color in the colors array.s
      color_index++; 
    } 

    setTimeout('bg_color_tween', 5);
  });
}

您正在引入一个旧的jQuery副本和一个新的jQueryUI副本-这不是一个好主意。乍一看，在颜色旋转一次后，您将得到一个错误，因为颜色索引将指向无效的索引。尝试将“if（color\u index==colors.length）”更改为“if（color\u index==colors.length-1）”，非常感谢韦斯利，它工作得非常好！