jQuery事件与动画

jQuery事件与动画

一.事件
1.加载Dom两种方式
①window.onload方式（1.执行时间:整个网页中所有内容(包括图片)加载完成后，才会执行  2.编写个数:1个）
②jQuery方式（1.执行时间:网页结构绘制完成后执行  2.编写个数:多个）
③两个都有的情况下执行顺序【面试频】（1.jQuery3.0:window.onload比jQuery先执行  2.jQuery1.0和2.0:jQuerytwindowonload先执行）

2.绑定事件两种方式
①元素.on("事件名",function(){})
②元素.事件名(function(){})

3.合成事件/事件切换
①hover():鼠标悬停合成事件（1.鼠标移上去第一个函数  2.鼠标移除第二个函数 ）
②toggle0:器标点击合成事件

4.事件传播(事件置泡)
①传播:小=->中..>大
②阳止传播:事件后面加上 return false

5.事件坐标
①offsetX:当前元素左上角
②clientX:窗口左上角
③pageX:网页左上角

6.移除事件
注意1:一般情况下，不会使用unbind，推荐使用变量控制事件
注意2:如果某个元素只允许使用一次事件，则可以使用one()

二.动画效果
1.基本
①显示:show(Time)
②隐藏:hide(Time)
③切换:toggle(Time)

2.滑动
① slideUp(Time):动画收缩(向上滑动)-->隐藏
② slideDown(Time):动画展开(向下滑动)-->显示
③slideToggle(Time):动画切换

3.淡入淡出(透明度)
①fadeIn(Time):淡入(透明度减少)
②fadeOut(Time):淡出(透明度增大)
③fadeToggle(Time):切换

4.自定义动面
①元素.animate({尾性:属性值},Time)
②缩放（1.width   2.eight）
③移动（1.top  2.left）
④移动(本元素)，距离（1.top="+="  2.left="-="）