zoukankan      html  css  js  c++  java
  • jq隐藏显示,淡入淡出,上下滑动,图片动画

    1、隐藏/显示,

    $(‘div’).hide();//隐藏

    <div id="fang" style=" 100px;height: 100px;background-color: #0000FF;display: block;">

    </div>

    <button id="b" type="button">点击</button>

    $('#b').click(function(){
    $('#fang').hide();//点击按钮时div隐藏
     });

    $(‘div’).show();//显示

    $(‘div’).toggle();//如果显示点击就隐藏,如果隐藏就显示

    2、淡入淡出

    $(div).fadeIn(speed,callback);淡入,一个慢慢的过程显示

    $(‘#id’).fadeIn(1000,function(){alert(‘aa’);});//结束淡入动作后弹框aa

    $(div).fadeOut(speed,callback);淡出

    $(div).fadeToggle(speed,callback);淡入淡出切换;

    $('#b').click(function(){//反复淡入淡出
    $('#fang').fadeToggle(2000,function(){
    $('#b').click();//调用自身
    })
    })

    $(div).fadeTo(speed,opacity,callback);渐变为给定的不透明度

    3、滑动

    $(div).slideDown(speed速度,callback回调函数,执行完之后再执行的函数);向下滑动

    $(div).slideUp(speed,callback);向上滑动

    $(div).slideToggle(speed,callback);滑动之间切换

    4、动画

    $(div).animate({params},speed时间,callback);

    可以使用相对值:

    $(div).animate({

    left:’200px’,

    height: ‘+=150px’,

    });

    $(div).animate({

    left:’200px’,

    height: ‘+=150px’,

    },4000,function);

    只有数字值可创建动画(比如 "margin:30px")。字符串值无法创建动画(比如 "background-color:red")

    队列功能:多个不同的动画会按照队列顺序执行;

    $(div).stop()用于动画或效果完成前对它们进行停止;写在按钮上会点击会使动画随时停止

  • 相关阅读:
    JAVA序列化
    python教程
    原来root用户只有本地的权限,需要手动将远程的权限打开,尝试了好几种方法,最后还是下面这种方法管用
    MYsql开启远程连接
    雅虎36条优化准则
    需要学习的技术
    可用的谷歌地址
    propertype和_proto_分析
    mvn 插件
    通过 api 调用检查具体日期是否为法定节假日
  • 原文地址:https://www.cnblogs.com/111wdh/p/12855946.html
Copyright © 2011-2022 走看看