zoukankan      html  css  js  c++  java
  • jQuery中的事件与动画

     一    基础事件

       1 jQuery中典型的事件方法

         单击事件  click(fn)

         按下键盘触发事件    kendown(fn) 

         失去焦点事件   blur(fn)

       2 常用的鼠标事件方法

         click(fn)  单击鼠标

         mouseover(fn)  鼠标指针移过时

         mouseout(fn)   鼠标指针移出时

       3 键盘事件

         keydown(fn)   按下键盘时

         keyup(fn)    释放键盘时

         keypress()   产生可打印的字符时

       4 表单事件

         focus()   获得焦点

         blur()     失去焦点

       5 绑定事件与移除事件

          语法 : bind(type,[data],fn)

         绑定一个事件

           

    $("button").bind("click",function(){
      $("p").slideToggle();
    });
    

       绑定多个事件

    $(selector).bind({event:function, event:function, ...})
    

     移除事件

          语法 :unbind([type],[fn]);

       

    $("button").click(function(){
      $("p").unbind();
    });
    

      复合事件

        hover()方法

          语法:hover(enter,leave);

       当鼠标指针悬停在上面时,改变 <p> 元素的背景颜色:

    $("p").hover(function(){
        $("p").css("background-color","yellow");
    },function(){
        $("p").css("background-color","pink");
    }); 
    

      toggle()方法

           语法:  toggle(f1,f2);

      二  jQuery中的动画

         1 控制元素显示与隐藏

            显示语法 : $(selector).show([speed],[callback]);

    $(".btn2").click(function(){
      $("p").show();
    });

            隐藏语法 :   $(selector).hide([speed],[callback]);

    $(".btn2").click(function(){
      $("p").hide();
    });
    

      2  改变元素的透明度

           淡入语法: $(selector).fadeIn([speed],[callback]);

      

    $(".btn2").click(function(){
      $("p").fadeIn();
    });
    

      淡出语法 :$(selector).fadeOut([speed],[callback]);

    $(".btn2").click(function(){
      $("p").fadeOut();
    });
    

      

  • 相关阅读:
    .Net 6+项目使用Husky.Net在项目提交时格式化代码
    maven 之将项目打包压缩。
    netty ChannelPipeline流处理源码详细分析
    maven 之 将资源文件 copy到classes目录中
    maven 之 根据不同环境,选择不同的配置文件。
    flex+spring+blazds 数据推送,client自动断开问题。
    C#如何读写xml文件
    序列化 与 反序列化
    DataSet与List的转换
    Python基础入门
  • 原文地址:https://www.cnblogs.com/sunbin123/p/6432889.html
Copyright © 2011-2022 走看看