jQuery动画和属性值百分比

我试图动画一个div，我试图在其他地方使用一些值，我知道值是正确的，因为我打印出输出…所以我想知道为什么它不能正常工作？

animateBar(percentage.toFixed(2)+'%'); [ . . . ] function animateBar(percentage) { $('#innerBox').animate({width: percentage}, 3000); } 

Answer 1

看起来似乎是使用动画百分比的错误。 http://bugs.jquery.com/ticket/10669

我建议计算自己添加的像素数，这样的事可能有效：

 percent = 0.25; add_width = (percent*$('#innerBox').parent().width())+'px'; $('#innerBox').animate({'width': '+='+add_width}, 3000); 

Answer 2

如果你很高兴使用CSS3过渡，这是有效的：

JS：

 function animateBar(percentage){ $('#innerBox').width(percentage+'%'); } 

CSS：

 #innerBox{transition: 3s} 

Answer 3

这是相当古老的，但这种方式对我有用：

 wthSelected = 85; $(this).animate({ width:wthSelected+'%' }, 1500); 

我也在使用jquery-1.11.2.min.js和jquery.mobile-1.4.5.min.js

Answer 4

尝试添加单位文本，如下所示：

 function animateBar(percentage) { $('#innerBox').animate({width: percentage+"px"}, 3000); } 

Answer 5

可能是你允许2个小数点的百分比。 您是否尝试过使用整数值？ 我不确定所有浏览器都支持浮动百分比。

另外，确保$('#innerBox')具有开始的设置width 。 它不一定是百分比。 它只需要在CSS中或通过JS方法设置。

Answer 6

如果它是百分比，那么在这里尝试这个

 function animateBar(percentage) { percentage = percentage+"%"; $('#innerBox').animate({'width': percentage}, 3000); } 

我们在这里使用css属性所以不要忘记单引号，所以它应该是’width’而不是width