缓动框架

1. 缓动框架遇到的两个问题

1. 原有的方法：div.style.width  à  这个方法比较固定，不能用变量/字符串的形式更换属性，不方便传值获取属性和给属性赋值
2. 属性值的获取和属性的赋值

div.style[“width”] = “5000px”；

可以通过传字符串/变量的方式获取和赋值属性

3. 获取任意类型的CSS样式的属性值

2. 缓动框架

1. 存在问题：很多属性我们的框架无法获取值和赋值
2. 主要处理两个

1. 透明度（旋转木马）

<1>值为小数，获取的时候要特殊处理

    opacity:0.5 à 内容一起透明（火狐谷歌IE9+），取值范围是0-1（写的时候写百分值的值，因为js一般不用小数运算）

    filter:alpha(opacity=50) à IE678(不研究)，取值范围是0-100

<2>兼容问题：IE678不识别opacity

2. 层级（旋转木马）（由需求决定）：层级的提高是一次性直接提到最高，不需要一点一点的缓动

3. 缓动框架案例

1. 旋转木马

1. 原理：先定义一个数组，数组中的元素是json，json中的元素是属性，点击一个按钮，按顺序更换数组中元素的位置（如果我们想要完成旋转木马，只需要更换数组中元素的位置）
2. 步骤：

<1>必须要让页面加载的时候把所有的属性加载出来，让我看看（核心）

<2>鼠标放到大盒子上显示对应的左右切换按钮，移开隐藏

<3>获取两个按钮，对他们进行事件绑定并判断

<4>如果是左侧的按钮执行一套程序，如果是右侧的按钮执行另一套程序

<5>绑定按钮的函数，一个是正转，一个是反转（传参确定）

<6>调换相应的数组对应的元素（先删除谁，再如何添加）

2. 正转反转问题

最开始是：12345；想变成23451

把1删除，在最后添加1

在数组json中，删除第一个元素，添加到最末尾（正转）

在数组json中，删除最后一个元素，添加到第一位（反转）

3、函数节流：定义一个变量，只有函数执行完毕再去执行下一个