jquery_事件与动画

事件绑定

    bind(type[,data],fn)(无限触发)

        type:事件类型包括jquery中已有事件也可以自定义事件

        data:可选参数,作为event.data属性传递给事件对象的额外数据对象

         fn:是用来绑定的处理函数 

    one(type[,data],fn)(只触发一次)

合成事件

 hover(enter,leave);用于模拟光标悬停事件

 toggle(fn1,fn2,...fn);模拟鼠标连续单击事件

事件冒泡

    如果内外元素绑定了同一事件,那么点击里面事件外面事件也会触发

    解决方法:添加事件对(event)      event.stopPagation()停止事件冒泡

阻止默认行为 :

    网页中的元素都有自己的默认行为 (单击超链接之后会跳转,表单的提交)

     event.preventDefault()   (return false)         阻止默认行为

事件对象属性:

       event.type()获取到事件的类型

       event.target()获取触发事件的元素

       event.pageX()和event.pageY() 获取光标相对于页面的x坐标和y坐标

       event.which()在鼠标单击事件中获取到鼠标的左,中,右键,在键盘事件中获取键盘的案件(1:鼠标左键:2鼠标中键:3鼠标右键)

       event.metaKey()获取<ctrl>按键

       event.originalEvent()指向原始的事件对象

移除事件:

      unbind([type],[,data])

       data:将要移除的函数

        如果没有参数则删除所有绑定事件

模拟操作:

      tigger(type[,data]) 可自定义也可以用jquery里本身的方法

动画

    show()显示  可填参数

    hide()隐藏  可填参数

    fadeIn() fadeOut()改变元素的不透明度

    slideUp() slideDown()改变元素高度 到0为止

    slow :0.6秒

    normal:0.4秒

    fast:0.2秒

自定义动画

 animate(params,speed,callback)

params:一个包含样式属性及值的映射

speed:速度,可选

callback:在动画完成时执行的参数 可选

累加 ,减: +=,-=

多重动画:后面在添加

 animate({left:"500px"},3000).animate({height:"500px"},5000)

停止动画

 stop([clearQueue][gotoEnd]):

 clearQueue:是否清空未执行的动画队列

 gotoEnd:是否直接将正在执行的动画跳转到末状态

直接调用stop()停止正在执行的动画

判断元素是否处于动画状态

  $(element).is(":animated")

toggle()  切换元素可见状态

slideToggle() 高度

fadeTo(600,0.2) 透明度

动画队列

 一组元素上的动画效果

  当在以一个animate()方法中应用多个属性时,动画是同时发生的

  链式,按顺序发生

多组元素上的动画效果

 默认情况下,动画都是同时发生的

 回调,按顺序

 

 

 

 

转载于:https://www.cnblogs.com/shuaif/p/3429882.html