这个滑动效果很赞的说，可以用在很多地方，导航条，图片放大缩小，应该是最大受益的了～～且看效果哦～
transition：[ transition-property ] || [ transition-duration ] || [ transition-timing-function ] || [ transition-delay ]
[ transition-property ]：
检索或设置对象中的参与过渡的属性;如果都参加就用all
[ transition-duration ]：
检索或设置对象过渡的持续时间
[ transition-timing-function ]：
检索或设置对象中过渡的动画类型
[ transition-delay ]：
检索或设置对象延迟过渡的时间
另外： transition-timing-function的设置参数如下
linear：
线性过渡。等同于贝塞尔曲线(0.0, 0.0, 1.0, 1.0)
ease：
平滑过渡。等同于贝塞尔曲线(0.25, 0.1, 0.25, 1.0)
ease-in：
由慢到快。等同于贝塞尔曲线(0.42, 0, 1.0, 1.0)
ease-out：
由快到慢。等同于贝塞尔曲线(0, 0, 0.58, 1.0)
ease-in-out：
由慢到快再到慢。等同于贝塞尔曲线(0.42, 0, 0.58, 1.0)
cubic-bezier(, , , )：
特定的贝塞尔曲线类型，4个数值需在[0, 1]区间内
比如说，定义个div，属性如下
.box1{ width:90px; height:90px; background-color:#666; border:4px solid #FFF;border-radius:50px;box-shadow: 5px 5px 6px 1px rgba(0, 0, 0, 0.4); }
.box1:hover{width:150px; height:150px;border-radius:150px;cursor: pointer;transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
} /*定义鼠标划过时候的效果*/
.box1{transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;}
/*定义鼠标不在时候的效果，正好用于显示鼠标移出时的效果*/
定义的圆形DIV就会随鼠标划过而放大，缩小，并且是很顺滑的效果～实在很赞～！
可悲的yo2不能支持定义<style>，不能演示效果了，如果用
onmouseover="this.style.backgroundColor='#FDFDEA';" 这类玩意又失去了意义，所以暂且就留文字吧～～
~~~~ ），爬起来，补上遗漏的一页。
nly-child