JavaScript: Set border radius

Question

How can I set the -moz-border-radius with pure JavaScript (no jQuery, no plugins etc)?

document.getElementById('id')

score 29 · Accepted Answer · answered Nov 25 '09 at 21:41

29

Try:

document.getElementById('id').style.borderRadius = '1em'; // w3c
document.getElementById('id').style.MozBorderRadius = '1em'; // mozilla

But why not do it in a stylesheet?

answered Nov 25 '09 at 21:41

Crescent Fresh

115,249
25
154
140

Okay, that works, thank you! How do I do that now for webkit? PS: I want to keep my css valid. – user199337 Nov 25 '09 at 21:47
3

style.WebkitBorderRadius = '1em'; // WebKit (Elijah Grey say this). And don't you want to accept an answer? – NilColor Nov 25 '09 at 22:12

score 26 · Answer 2 · answered Nov 25 '09 at 21:55

26

var myElementStyle = document.getElementById('id').style;

myElementStyle.borderRadius = '1em'; // standard
myElementStyle.MozBorderRadius = '1em'; // Mozilla
myElementStyle.WebkitBorderRadius = '1em'; // WebKit

answered Nov 25 '09 at 21:55

Eli Grey

35,104
14
75
93

JavaScript: Set border radius

2 Answers2

Linked

Related