jquery使用percenteges进行动画制作 [英] jquery animate with percenteges
本文介绍了jquery使用percenteges进行动画制作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
有什么方法可以使用jquery百分比为div设置动画?
Is there any way i can animate a div using percentages with jquery?
我试过这些:
$('.box1').animate({width:($(".wrapper").width()*.100)},"fast");})
$('.box1').animate({width:'100%'},"fast");})
$('.box1').animate({width:100%;})
以上工作都不是......
none of the above work...
任何想法?
UPDATE
var p_e_h= 1.0;
var p_e_w= 1.0;
$('.box1').animate({width:($(".wrapper").width()* p_e_w)},"fast");
$('.box1').animate({height:($(".wrapper").height()* p_e_h)},"fast");
宽度有效,但高度没有。除非我再次点击按钮。
width works, but height does not. Unless i click the button again.
推荐答案
var fiftyPrct = 0.5, //50%
hundredPrct = 1; //100%
$('.box1').animate({ width: ($('.wrapper').width() * fiftyPrct) }, 'fast');
$('.box2').animate({ width: ($('.wrapper').width() * hundredPrct) }, 'fast');
工作正常。
更新
由于您正在进行2个不同的 .animate
调用,因此动画会排队并执行顺序。只需使用相同的动画调用即可:
Since you are doing 2 different .animate
calls, the animations are queued and executed sequentially. Just do them with the same animation call:
var p_e_h= 1.0;
var p_e_w= 1.0;
$('.box1').animate({
width: ($(".wrapper").width() * p_e_w),
height:($(".wrapper").height() * p_e_h)
},"fast");
工作示例: jsFiddle
这篇关于jquery使用percenteges进行动画制作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文