fade

作者: 潇潇翔子 | 来源:发表于2018-08-25 09:03 被阅读5次

jQuery fadeIn(): 用于淡入已隐藏的元素
$(selector).fadeIn(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是 fading 完成后所执行的函数名称。

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

jQuery fadeOut() : 方法用于淡出可见元素
$(selector).fadeOut(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是 fading 完成后所执行的函数名称。

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

jQuery fadeToggle()

可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
如果元素已淡出,则 fadeToggle() 会向元素添加淡入效果。
如果元素已淡入,则 fadeToggle() 会向元素添加淡出效果。

$(selector).fadeToggle(speed,callback);

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

jQuery fadeTo()方法允许渐变为给定的不透明度(值介于 0 与 1 之间)
$(selector).fadeTo(speed,opacity,callback);

必需的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
fadeTo() 方法中必需的 opacity 参数将淡入淡出效果设置为给定的不透明度(值介于 0 与 1 之间)。
可选的 callback 参数是该函数完成后所执行的函数名称。

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});

相关文章

  • Activity_动画效果的跳转

    介绍 使用系统的动画 fade_in:(android.R.anim.fade_in) fade_out:(and...

  • fade

    jQuery fadeIn(): 用于淡入已隐藏的元素$(selector).fadeIn(speed...

  • 《Fade》

    当六棱的雪花飘落在你的衣襟, 我想该为你写上一段诗句, 代表我在颂扬冬天纯洁的美丽。 你是如此的安静, 就像一阵风...

  • Fade

    我站在岁月的巷口回望 回望高楼和梦想 也回望田野和故乡 陪我一路走来的风景 被遗忘在旧日时光 楼很高,遮住了希望 ...

  • Fade

    一个广场舞大妈曾告诉我,如果她跳的足够快,她的孤独就追不上她;一位拾荒大叔曾告诉我,如果他翻垃圾翻的足够仔细,便能...

  • fade

    每一分 每一秒 都想知道你在做什么 你知道吗 起风了 我还在一个人的夜里

  • Fade

    Fade. 后来,偶然地,我知道了故事的原本。那是高考过后的假期里的一个晚上,我 又看完一部小说,觉得也没什么...

  • Fade

    I saw the light fade from the sky,on the wind,I heard a...

  • 第6章 vue中css过渡动画原理

    我们给transition name属性定义的是fade 所以是下面名称:fade-enter fade-e...

  • 页面跳转动画

    使用: 在res中创建一个anim包,创建文件fade_in xml: fade_out xml: fade_in...

网友评论

      本文标题:fade

      本文链接:https://www.haomeiwen.com/subject/qdpwiftx.html