If I were writing a JavaScript line to set a style attribute of an element it could look like this (this example: "width"):
document.getElementById('myDiv').style.width="50px";
and if there is a dash in the CSS element it would look like this (this example: "margin-top"):
document.getElementById('myDiv').style.marginTop="15px";
But how do I access the prefix -webkit-, if I want to give it a style like this example:
{-webkit-transition: width 1s;}
You have two options:
style["-webkit-transition"]style.WebkitTransitionThe first directly works. The second notation is called camel case, and foo-bar-baz becomes fooBarBaz. As a result, when a non camel case string starts with -, the first letter is capitalized in camel case.
If you don't want to keep digging up those pesky style properties and their naming conventions you can always use jQuery to keep it simple.
$('#myDiv').css("-webkit-transition", "value");
One possibility would to use for example jquery, to make it easy. If you want a pure javascript solution, then read this: http://www.javascriptkit.com/javatutors/setcss3properties.shtml
