jQuery事件和效果

、一、jQuery css() 方法

（1）、jQuery方法是什么

css() 方法设置或返回被选元素的一个或多个样式属性。

(2)、返回 CSS 属性

语法：css("propertyname")

(3)、设置CSS属性

语法：css("propertyname","value")

(4)、设置多个CSS属性（JSON对象）

语法：css({"propertyname":"value","propertyname":"value",...})

二、、jQuery css类

（1）、addClass()   向被选元素添加一个或多个类

 

（2）、removeClass()   从被选元素删除一个或多个类

（3）、toggleClaaa()  对被选元素进行添加/删除类的切换操作

（4）、eq()   返回带有被选元素的指定索引号的元素，索引号从 0 开头，所以第一个元素的索引号是 0（不是 1）

（5）、index（）返回指定元素相对于其他指定元素的 index 位置

（6）、not()  返回指定元素之外的元素

三、jQuery动画

speed参数规定时长，可取以下值："slow","fast"或毫秒

callback参数是效果执行完成后的函数，回调函数

opacity参数是将淡入淡出效果设置为给定的透明度（0~1之间）

params参数是定义行成动画的css属性

(1)    、jQuery隐藏显示  {hide()、show()、toggle()}

可以使用 hide() 隐藏和 show() 方法显示 HTML 元素。

可以使用 toggle() 方法来切换 hide() 和 show() 方法。

语法：　　$(selector).hide(speed,callback)

　　　　$(selector).show(speed,callback)

　　　　$(selector).toggle(speed,callback)

(2)    、jQuery淡入淡出{fadeIn()、fadeOut()、fadeToggleI()、fadeTo()}

fadeIn() 用于淡入已隐藏的元素， fadeOut() 方法用于淡出可见元素。

fadeTo()方法允许渐变为给定不同的透明度

fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换

语法：$(selector).fadeIn(speed,callback)

　　　　$(selector).fadeOut(speed,callback)

　　　　$(selector).fadeToggle(speed,callback)

　　　　$(selector).fadeTo(speed,opacity,callback)

(3)    、jQuery滑动{slideDown()、slideUp()、slideToggle()}

 slideDown() 方法用于向下滑动元素， slideUp() 方法用于向上滑动元素

 slideToggle() 方法可以在 slideDown() 与 slideUp() 方法之间进行切换

语法：　　$(selector).slideDown(speed,callback)

　　　　$(selector).slideUp(speed,callback)

　　　　$(selector).slideToggle(speed,callback)

(4)    、jQuery自定义动画{animate()}

animate()用于创建自定义动画

语法：$(selector).animate({params},speed,callback)

(5)    、stop方法

语法：$(selector).stop(stopAll,goToEnd)

四、事件机制

(1)    、注册事件{on()、bind()}

bind() 、on() 方法向被选元素添加一个或多个事件处理程序，以及当事件发生时运行的函数。

语法：$(selector).on(event,childSelector,data,function)

$(selector).bind(event,data,function)

(2)    、委托事件{delegate}

delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数

语法：$(selector).on(childSelector,event,data,function)

(3)    、事件对象event

event对象有以下属性

type：事件类型，比如click。

which：触发该事件的鼠标按钮或键盘的键。

target：事件发生的初始对象。

data：传入事件对象的数据。

pageX：事件发生时，鼠标位置的水平坐标（相对于页面左上角）。

pageY：事件发生时，鼠标位置的垂直坐标（相对于页面左上角

(4)    、each()方法

each() 方法为每个匹配元素规定要运行的函数。

语法：$(selector).each(function(index,element))