JQuery效果-淡入淡出和滑动

1、 toggle(); 用来切换 hide() 和 show() 方法。显示被隐藏的元素,并隐藏已显示的元素。

语法:$(selector).toggle(speed, callback);
speed:规定隐藏和显示的速度;callback:toggle执行完成之后回调的函数名称。

2、$(selector).fadeIn(speed, callback); 用来淡入已隐藏的元素。

3、$(selector).fadeOut(speed, callback); 用来淡出可见的元素。

4、$(selector),fadeToggle(speed, callback); 用来切换fadeIn()和fadeOut()方法。

5、$(selector).fadeTo(speed, opacity, callback); 允许渐变为给定的透明度(0-1之间)。

6、$(selector).slideUp(speed, callback); 用于向上滑动元素。

7、$(selector).slideDown(speed, callback); 用于向下滑动元素。

8、$(selector).slideToggle(speed, callback); 用户切换slideUp()和slideDown()方法。

9、$(selector).animate({params}, speed, callback); 用于创建自定义动画

  • 必选的params参数:定义形成动画的css属性
  • 特点:① 可以写多个值
  • ② 可以使用相对值({height:’+=150px’,width:‘100px’})
  • ③ 使用预定义的值(show、hide、toggle)
  • ④ 使用队列功能
$("button").click(function() {
	var div = $("div");
	div.animate({height:'300px', opacity:'0.4'}, "slow");
	div.animate({width:'300px', opacity:'0,8'}, "slow");
	div.animate({height:'100px', opacity:'0.4'}, "slow");
	div.animate({width:'100px', opacity:'0.8'}, "slow");
})

10、$(selector).stop(stopAll, goToEnd); 用于停止动画或效果,在它们完成之前,适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。

  • stopAll 参数:规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。
  • goToEnd 参数:规定是否立即完成当前动画。默认是 false。
  • 默认的stop() 会清除在被选元素上指定的当前动画。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值