js 动画

js动画总是很别扭 不知道是我水平问题还是js的异步特性问题
放一个简单的动画实现 顺便复习一下js的数组 古人云 学而时习之不亦乐乎
虽然简单但也有些微的成就感
/// <reference path="..\jquery-1.4.1-vsdoc.js"/>
var i = 0;
function move_div() {
var a = [50, 100, 150, 200, 250];
$("#content").css("left", a[i]);
i++;
if (i > a.length) {
clearInterval(intervalProcess);
i = 0;
return false;
}
}

function change_div(oid, width, height, left, backgroundcolor) {
var a = $("#" + oid + "");
a.css("width", width);
a.css("position", "absolute");
a.css("left", left);
a.css("height", height);
a.css("background-color", backgroundcolor);
return a;
}

$(function () {
var div = $("#content");
change_div("content", 50, 50, 50, "blue");
div.before($("<button>").html("move").attr("id", "move"));
$("#move").click(function () { intervalProcess = setInterval(move_div, 1000); });
})

 

posted on 2012-02-20 10:29  xinshenghu  阅读(372)  评论(0编辑  收藏  举报