jquery显示隐藏操作

记得还是当初开始学习jquery的时候有去用心看看文档,然后在做项目的时候偶尔有用到,一直没有闲暇之余去温习,去整理所谓的基础,看了后有些淡忘的得以再次更新。

第一、隐藏显示

以下所有的代码如无特殊声明中speed的值可选且可填写(slow,fast,number(毫秒))。callback为执行完后要执行的函数也是可选参数。

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

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

$(selector).toggle(speed,callback); //基于show()和hide()进行切换

第二、淡入淡出

注意:以下语法中fade后面的第一个字母必须是大写。

$(selector).fadeIn(speed,callback);//显示

$(selector).fadeOut(speed,callback);//隐藏

$(selector).fadeToggle(speed,callback);//测试时无效。火狐监测提示TypeError: $(...).fadeToggle is not a function。按语法其他都有效这个就这样不解?

后来找到了原因,引用的js库里面没有实现这个方法。版本是1.4.1。后来在官网下了个2.1.4的就可以了。看来还得要更上时代,否则很多弊端。

$(selector).fadeTo(speed,opacity,callback);//渐变 speed和opacity是必须的参数。opacity的取值是0-1.值越大渐变越清晰

第三、上下滑动

注意:以下语法中slide后面的第一个字母必须是大写.好奇的厕所了下slideLeft()和slideRight,结果是无效(*^__^*) 嘻嘻。

$(selector).slideUp(speed,callback);//向上滑直到消失

$(selector).slideDown(speed,callback);向下滑直到整个div的大小呈现

$(selector).slideToggle(speed,callback);//基于slideUp()和slideDown()进行切换

测试截图:

原文地址:https://www.cnblogs.com/professional-NET/p/4700771.html