#动画部分
最动画要做绝对定位,写left,写top;定好位置;
动画主要是从5个方向改变:
- 宽度 (width)
- 高度 (height)
- 水平 (left)
- 垂直 (top)
- 透明度 (opacity)
JS写动画,主要是学逻辑关系,深入研究闭包作用域;并不是完全用JS写动画。CSS3做这个会更好;
#同步和异步编程
js是单线程的编程方法;
- 同步:上面事情等待,在此期间我要一直等,只有这件事做完才能做下件事情
- 异步:模拟多线程,上面的事情正在等待中,我们不需要等它,继续做下面的事情,当下面的事情做完了,然后我们发现上面的事情也等待完成了,在执行上面的事情
同步编程的例子:
function fn() {
for (var i = 0; i < 1000; i++) {
}
console.log(i);//只有循环完成才能输出i
return i;
}
var c = fn();
console.log(c);//只有fn执行完成后才会输出c
异步编程例子:
1、所有的事件绑定都是异步编程
oDiv.onclick=function(){}
window.onload=function(){}
console.log(100);
2、定时器都是异步编程
定时器的等待时间是有最小值的 每个浏览器都有一个最小值,即使你写的是0,也不是立即执行;定时器和别的代码是两个频道的。异步执行;作用域和预解释的时候有总结过;
var num = 12;
window.setTimeout(function () {
num++;
console.log(num);
}, 5);
for (var i = 0; i < 10000; i++) {//这个循环时间肯定大于5ms,但是也是先从上倒下执行,只有下面的代码都执行完成,才会返回头看定时器是否到时间,到了在执行定时器里面的
}
console.log(num);
//先输出12然后在输出13;说明是先执行完for循环和后面的打印;然后才切到定时器的执行的;
动画中的几部分:
-
开始位置、结束位置、总距离;(总距离=结束位置-开始位置) -
总运动时间、定时器间隔时间 、步长 ;(步长=(总距离/总运动时间)*定时器间隔时间) -
运动的方式:匀速、减速、加速、变速