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

    html代码:

    <button id="b1" type="button">淡出</button>
    <button id="b2" type="button">淡入</button>
    <button id="b3" type="button">淡入淡出</button>
    <button id="b4" type="button">透明度</button>
    <div id="div1" style="background:red;200px;height:200px">qqqqqqqqqqqqq</div>
    <div id="div2" style="background:#00FF00;200px;height:200px">eeeeeeeeeeeeeee</div>
    <div id="div3" style="background:#0000FF;200px;height:200px">gggggggggggggggggg</div>

    js代码:

     $(function(){
        $("#b1").click(function(){
            $("#div1").fadeOut();
            $("#div2").fadeOut("slow");
            $("#div3").fadeOut(3000);
        });
        $("#b2").click(function(){
            $("#div1").fadeIn();
            $("#div2").fadeIn("slow");
            $("#div3").fadeIn(3000);
        });
        $("#b3").click(function(){
            $("#div1").fadeToggle();
            $("#div2").fadeToggle("slow");
            $("#div3").fadeToggle(3000);
        });
        $("#b4").click(function(){
              $("#div1").fadeTo("slow",0.15);
              $("#div2").fadeTo("slow",0.4);
              $("#div3").fadeTo("slow",0.7);
        });
      });
  • 相关阅读:
    video和audio
    H5-geolocation学习
    hammer.js学习
    echarts学习
    移动端手势识别
    SVG
    e.key && e.which && e.keyCode
    git中避免提交.DS_Store文件[转载]
    前端笔试题[1]
    Javascript实现格式化输出
  • 原文地址:https://www.cnblogs.com/yby-blogs/p/4268165.html
Copyright © 2011-2022 走看看