如何用jQuery的animate()方法创建动画?

今天,给大家讲讲用JavaScript的jQuery库创建动画,那么创建动画我们用到的是animate()方法,其实方法比较简单,所以很少有人专门写这个东西,那么我今天就给刚入门的小白同学门讲一讲如何用该方法,看完一定自己动手实现一下哦!
animate()可以同时操作多个属性,例子如下

(“button”).click(function(){ (“div”).animate({
left:’200px’,
opacity:’0.5’,
height:’250px’,
width:’250px’
});
});*
animate()可以定义元素的相对值,该值相当于元素的原来值,只需在前面加+=或者-=,例子如下:

(“button”).click(function(){ (“div”).animate({
left:’250px’,
height:’+=100px’,
width:’+=100px’
});
});

animate()使用预定义值,可以把提前设置属性,比如hide,show等,例子如下:
(“button”).click(function(){ (“div”)animate({
width:’show’
});
});
jQuery默认提供动画的队列功能,可以编写多个animate()方法,jQuery利用内部的队列功能逐一调用animate()方法,例子如下:

(“button”).click(function(){    var dd= (“dd”);
dd.animate({height:’300px’,opacity:’0.2’},”slow”);
dd.animate({width:’300px’,opacity:’0.7’},”slow”);
dd.animate({height:’100px’,opacity:’0.2’},”slow”);
d.danimate({width:’100px’,opacity:’0.7’},”slow”);
});
好,今天的分享就到这了,如果你有好的建议,或者向和我成为学习伙伴,欢迎关注小姐姐呦!

猜你喜欢

转载自blog.csdn.net/qq_40859799/article/details/81357825