How to set CSS3 transition using javascript?

Question

How can I set CSS using javascript (I don\'t have access to the CSS file)?

#fade div {
  -webkit-transition: opacity 1s;
  -moz-transition: opacity 1s;
  -o-         


        

Answer 1

you should use the camelCase notation like so:

document.getElementById('fade').style.webkitTransition = 'opacity 1s';

like every property composed by more than one word and hyphen-separated (e.g. css background-position turns into js backgroundPosition.

Probably at this time not every browser adopted this notation in properties involving browser specific prefixes, so there are some browser like firefox still accepting Moz instead of moz (see https://bugzilla.mozilla.org/show_bug.cgi?id=607381)