jQuery学习：内置动画淡出/淡入展开/收缩显示/隐藏

本文介绍: fa deOut():慢慢淡出改变透明度 op city 1–0 然后显示 display:none。fa deIn：淡入 display 0 –1 display block。速度的取值：s low normal fast 1000ms 取值。显示隐藏：默认没有动画——–这三个属性是东湖。t oggle:（不）带动画的切换显示/隐藏。慢慢展开：slideDown 向下展开。show():（不）带动画的显示。hide():（不）带动画的隐藏。改变的有透明度宽高 –fad eOut(速度，)

fad eOut():慢慢淡出改变透明度 op city 1–0 然后显示 display:none

fa d eOut(速度，)

速度的取值：slow normal fast 1000ms 取值

		var $div1=$('.div1')
	$('#btn1').click(function(){
				$div1.fadeOut(1000)
			});

fa deIn：淡入 display 0 –1 display block

			$('#btn2').click(function(){
				$div1.fadeIn(1000)
			});

切换淡入淡出效果

			$('#btn3').click(function(){
				$div1.fadeToggle()
			});

可以有回调函数对动画完成做出指示

			var $div1=$('.div1')
			$('#btn1').click(function(){
				$div1.fadeOut(1000,function(){
					alert('动画完成了');
				});
			});
			$('#btn2').click(function(){
				$div1.fadeIn(1000);
			});
			$('#btn3').click(function(){
				$div1.fadeToggle()
			});

慢慢收缩：slideUp 向上收缩主要变化的是当前元素变化的高度

慢慢展开：slideDown 向下展开

收缩展开切换：

			$('#btn4').click(function(){
				$div1.slideUp();
			});
			$('#btn5').click(function(){
				$div1.slideDown();
			});
			$('#btn6').click(function(){
				$div1.slideToggle()
			});

显示隐藏：默认没有动画——–这三个属性是东湖改变的有透明度宽高 —-加上时间就是动画

show():（不）带动画的显示

hide():（不）带动画的隐藏

to ggle:（不）带动画的切换显示/隐藏

			$('#btn7').click(function(){
				$div1.show();
			});
			$('#btn8').click(function(){
				$div1.show(1000);
			});
			$('#btn9').click(function(){
				$div1.hide(1000)
			});
			$('#btn10').click(function(){
				$div1.toggle()
			});