jQuery 动画方法

2021-01-09 15:31

阅读:608

标签:执行   display   anim   时间   适用于   top   play   设置   height   

    1. 隐藏与显示(利用了display属性)
  • hide();  隐藏      如: $("p").hide();  下同
  • show();  显示
  • 淡入与淡出(利用display属性,可设参数设置快慢或时间)
    • fadeIn();  淡入已隐藏元素
    • fadeOut();   淡出可见元素
    • fadeToggle();  在fadeIn()和fadeOut()之间进行切换
    • fadeTo();  允许渐变为给定不透明度
      • fadeTo("slow",0.15)
  • 滑动
    • slideDown()  下滑
    • slideUp  上滑
    • slideToggle()  在上滑和下滑之间切换
  • 自定义动画
    • animate() 方法用于自定义动画
    1 $("button").click(function(){
    2     $("div").animate({
    3     left:‘250px‘, opacity:‘0.5‘, height:‘150px‘, width:‘150px‘
    4     }); 
    5 });      
      1. stop()  停止动画效果
    • 在动画完成之前,适用于所有jQuery效果函数,包括滑动,淡入淡出和自定义动画。
    • 写在动画之前
      • 例如 $("p").stop().slideDown()
  • 回调函数
    • 当前动画100%完成之后执行
    1 $("button").click(function(){
    2     $("p").hide("slow",function(){
    3         alert("段落现在被隐藏了");
    4     }); 
    5 });

     

    jQuery 动画方法

    标签:执行   display   anim   时间   适用于   top   play   设置   height   

    原文地址:https://www.cnblogs.com/hjcby/p/13513848.html


    评论


    亲,登录后才可以留言!