.hide() / .show() / .toggle() ——元素的隐藏 / 显示 / 切换隐藏与显示

一、.hide()——元素的隐藏

描述：让元素隐藏起来，实际就是将display:none

改变内容：宽度、高度、透明度

参数：

1、动画执行时间

2、速度曲线

3、隐藏后执行的函数

写法：

1、元素.hide();

 $("p").hide();     

2、元素.hide(速度曲线)——隐藏速度的快慢

参数：

slow —— 600ms

normal——400ms

fast——200ms

$("p").hide( "slow" );  

3、元素.hide(隐藏的时间)——指定动画执行的时间

单位：毫秒

 $("p").hide(3000);    

4、元素.hide(function(){});

$("p").hide( 1000, function(){
      alert("隐藏完毕!");
} );

5、多个参数：元素.hide(参数1,参数2);

$("p").hide( 1000, "linear" );  

6、元素.hide( { duration:数值,easing:数值,complete:数值 } );  

 $("p").hide( { duration: 1000 } );  

 

二、.show()——元素的显示

写法：元素.show();

$("#show").click(function(){
  $("p").show();
});

 描述：其他与.hide()相同

 

三、.toggle()——切换元素的隐藏与显示

写法：元素.toggle();

描述：切换元素的可见状态，如果元素是显示的则隐藏，如果是隐藏的则显示

$("button").click(function(){
  $("p").toggle();
});