javascript a -o-transform ... w operze 10.5

w dziale Strony WWW w Operze
volumeY napisał(a):

Witam,
Mam pytanie co do opcji js dla styli w css.
Najnowsza opera (jeszcze testowa) 10.5 w koncu wprowadzila wlasciwosc -o-transform. Wszystko ok sie wydaje ale gdy probuje wdrozyc to w JS to nie dziala tak jak np. w -webkit-transform (safari, chrome).

Przykladowo probuje zrobic cos takiego:

<div onclick="klik();" id="wiatrakx" style="width: 200px; height: 200px; border: 1px solid black;"></div>
<script type="text/javascript">
function klik()
{
document.getElementById('wiatrakx').style['-o-transform']='rotate(30deg)';
document.getElementById('wiatrakx').style['-webkit-transform']='rotate(30deg)';
document.getElementById('wiatrakx').style.background='green';
}
</script>

Czyli po kliknieciu ma sie pojawic zielony kolor tla (pojawia sie) oraz powinno sie obrocic o 30deg - no i nie obraca sie... dla porownania w safari i chrome sie obraca...

No i setno pytania - czyli z tego wynika ze nie wystarczy sama wlasciwosc zeby i po przez JS dalo sie cos zrobic?

nowotny napisał(a):

Mnie się to udało zrobić poprzez usunięcie atrybutu stylu z diva i wrzucenie go do arkusza oraz poprzez zmianę tego atrybutu z poziomu Javaskryptu...

<style type="text/css">#wiatrakx{width: 200px; height: 200px; border: 1px solid black;}</style>
<div onclick="klik();" id="wiatrakx"></div>
<script type="text/javascript">
function klik()
{
document.getElementById('wiatrakx').setAttribute('style','-o-transform: rotate(30deg)');
document.getElementById('wiatrakx').style['-webkit-transform']='rotate(30deg)';
document.getElementById('wiatrakx').style.background='green';
}
</script>

Zajec napisał(a):

Gdy z poziomu JavaScript odwołujesz się do stylów z myślnikami, musisz usunąć wszystkie myślniki, a litery które znajdowały się za myślnikami zamienić z małych na wielkie. Czyli:
color → color
background-color → backgroundColor
-o-transform → OTransform

...style.OTransform = 'rotate(...)';