zoukankan      html  css  js  c++  java
  • jquery实现淡入淡出

    fade方法包括四个:

    (1)fadeIn(speed,callback):淡入的方法,speed代表淡入的速度,可以是slow,fast,毫秒,不填等

    例如:

    $(document).ready(function(){
    $("button").click(function(){
    $("#div1").fadeIn();
    $("#div2").fadeIn("slow");
    $("#div3").fadeIn(3000);
    });
    });

    (2)fadeOut(speed,callback)方法:淡出的方法,参数的意义如上。

    例如:

    $(document).ready(function(){
    $("button").click(function(){
    $("#div1").fadeOut();
    $("#div2").fadeOut("slow");
    $("#div3").fadeOut(3000);
    });
    });

    (3)fadeToggle(speed,callback)方法:可以同时切换淡入淡出。

    例如:

    $(document).ready(function(){
    $("button").click(function(){
    $("#div1").fadeToggle();
    $("#div2").fadeToggle("slow");
    $("#div3").fadeToggle(3000);
    });
    });

    (4)fadeTo(speed,opacity,callback)方法:允许渐变为给定的不透明度(值介于 0 与 1 之间),相当于不是淡入或者淡出完全不见,而是淡出到一个程度,有了一个透明度。

    例如:

    $("button").click(function(){

    $("#div1").fadeTo("slow",0.15);

    $("#div2").fadeTo("slow",0.4);

    $("#div3").fadeTo("slow",0.7);

    });

  • 相关阅读:
    七种数据类型
    js字符串解析成数字
    html节点操作与事件
    form表单的默认提交行为
    CSS中的各种width(宽度)
    Javascript读写CSS属性
    ECMAScript6新特性之Reflect
    ECMAScript6新特性之String API
    ECMAScript6新特性之Array API
    判断Javascript对象是否为空
  • 原文地址:https://www.cnblogs.com/sophiehui/p/5783309.html
Copyright © 2011-2022 走看看