0
我在下面有下面的代碼。它在safari中可以正常工作,但是在IE中,背景只是旋轉一次,然後停在粉紅色上。jQuery的背景不重複在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:[email protected]" 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>
- 不是一個好主意。 – Pointy 2011-06-03 14:45:16
乍一看,顏色旋轉一圈後會出現錯誤,因爲color_index將指向無效索引。嘗試將'if(color_index == colors.length)'改爲'if(color_index == colors.length - 1)' – WesleyJohnson 2011-06-03 14:45:24
非常感謝Wesley的工作完美! – Miles 2011-06-05 07:56:59