美文网首页
jQuery效果(显示隐藏,淡入淡出)

jQuery效果(显示隐藏,淡入淡出)

作者: WANG_M | 来源:发表于2017-11-13 09:21 被阅读0次

1.隐藏显示,之前我们都是通过设置元素的css样式来让它显示隐藏,现在我们只需要用

jQuery中的hide()和show()来实现这两个功能。input点击段落p进行显示隐藏


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


$("p").show();  //hide();

})

$("p").show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

jQuery toggle()

通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法。

显示被隐藏的元素,并隐藏已显示的元素;

2.jQuery中的淡入淡出,

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

jQuery fadeOut() 用于淡入已显示的元素。$("p").fadeOut(speed,callback);

jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。

             如果元素已淡出,则 fadeToggle() 会向元素添加淡入效果。

             如果元素已淡入,则 fadeToggle() 会向元素添加淡出效果。

              $("p").fadeTaggle(speed,callback);

jQuery fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。

             $("p").fade(speed,callback);

相关文章

  • jQuery 效果

    目录 jQuery 隐藏/显示jQuery 淡入淡出jQuery 滑动jQuery 动画jQuery Callba...

  • jQuery效果总结

    隐藏/显示jQuery hide()和show(): jQuery toggle(): 淡入淡出fadeIn()、...

  • jQuery效果(显示隐藏,淡入淡出)

    1.隐藏显示,之前我们都是通过设置元素的css样式来让它显示隐藏,现在我们只需要用 jQuery中的hide()和...

  • 05-老马jQuery教程-动画

    前言 jQuery的动画系统做的非常出色,而且把最常用的显示、隐藏、淡入淡出、滑动显示和折叠凳效果都做了很好的封装...

  • jQuery 淡入淡出

    通过 jQuery,您可以实现元素的淡入淡出效果。 jQuery fadeIn() 用于淡入已隐藏的元素。 1.先...

  • jQuery(二)

    jQuery效果 隐藏与显示 隐藏效果,1000ms后隐藏 显示效果show(),1000ms后显示 toggle...

  • 04-jQuery动效

    jQuery效果 显示与隐藏动画 显示 show([speed,[easing],[fn]); 隐藏 hide([...

  • jquery 淡入淡出以及获取slideToggle状态

    查了一下w3c资料 都归于jQuery 效果 - 淡入淡出一类。可以看出这四个效果的实质是显示与隐藏,只不过展示的...

  • jQuery基础动画篇

    jQuery动画一、动画1.1、隐藏和显示hide() show();原理同上.1.2、淡入淡出 1.3、滑动 1...

  • JQuery常用语句整理(一)

    JQuery效果 **隐藏和显示 ** $("p").hide(speed,callback); (显示)$...

网友评论

      本文标题:jQuery效果(显示隐藏,淡入淡出)

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