CODEWITHSUNDEEP
javascripthtmlcss
การรกาาร นานนานกาพ
การรกาาร นานนานกาพ

Reputation: 27

How to add padding-left in javascript?

How do I change the padding-left for an element in JavaScript? I have used this code and it works: 

$(".number_1").stop().animate({height: '295px', width: '210px', opacity: 1}, 100);

However, when I add padding-left to the code, it doesn't work: 

$(".number_1").stop().animate({padding-left: '10px', height: '295px', width: '210px', opacity: 1}, 100);

How do I add padding-left in code for it to work?

Upvotes: 1

Views: 1937

Answers (5)

Punitha Subramani
Punitha Subramani

Reputation: 1477

You have to wrap the style rule in quotes:

.animate({'padding-left' : '20px' });

Or you can use this:

 $("#p1").animate({paddingLeft:"+=100px"});

Here is a W3Schools Tryit Editor demonstrating how to use 'padding-left' or 'paddingLeft' in JQuery animations.

Upvotes: 1

Girish
Girish

Reputation: 12127

add quote(") if using padding-left or change first latter into upper case if properly have - then use paddingLeft

$(".number_1").stop().animate({paddingLeft: '10px' ,height: '295px' ,width: '210px' ,opacity: 1}, 100);

OR

$(".number_1").stop().animate({"padding-left": '10px' ,height: '295px' ,width: '210px' ,opacity: 1}, 100);

Upvotes: 1

Vishwanath
Vishwanath

Reputation: 6004

String in key for objects without quotes only work when they can be parsed successfully. Add quotes around padding left and that should work.

$(".number_1").stop().animate({"padding-left": '10px' ,height: '295px' ,width: '210px' ,opacity: 1}, 100);

Upvotes: 1

user2908232
user2908232

Reputation: 451

Use paddingLeft when you're working with javascript, although in this specific case 'padding-left' might also work (not entirely sure on that though, as that would be a jQuery specific implementation thing).

$(".number_1").stop().animate({paddingLeft: '10px' ,height: '295px' ,width: '210px' ,opacity: 1}, 100);

And just a general tip, you should not put a space before the comma, but after it.

Upvotes: 0

Litestone
Litestone

Reputation: 539

Try 'paddingLeft' instead of 'padding-left'.

Upvotes: 0

Related Questions