FlyingUnderpants FlyingUnderpants - 17 days ago 5
Javascript Question

Calculate inside of an animate function

Well I am going to keep this one short. Let's start with my code:

$container.animate({
paddingBottom: //315% + 100px
});


What I have here is a short bit of code, which sould animate a 315% + 100px padding-bottom. The problem is how can I make jQuery calculate this. I tried things as "calc(315% + 100px)" like it works in css, but it doesn't fix the problem in jQuery. Also I tried multiple thing with variables, +-signs and "". Still I can't find a solution. I hope someone can help me, thanks in advance!

ps: don't worry about $container it's a working variable

Answer

According to MDN, when setting padding to percentages, it's always based on the containing elements width

Knowing that, you need the parent elements width * 3.15 + 100

$container.animate({
    paddingBottom: ($container.parent().width() * 3.15) + 100
}); 
Comments