Pergunta

I am using web-kit transitions in an iPad app. They work great. But I was wondering what I would do to change the values of my transition using javascript.

#container {
            -webkit-transition-property: -webkit-transform;
            -webkit-transition-duration: 1s;
            -webkit-transition-timing-function: ease-out;       
        }

What I would like to do:

<script>
    function func() {
        document.getElemeentById('container').transition.duration = 500;

   }
</script>

Is this possible?

Foi útil?

Solução

Can be done with:

document.getElementById('container').style['-webkit-transition-duration'] = '500s';

See http://jsfiddle.net/z3bKD/2/.

Outras dicas

Jakub's answer was good, but to update it, you can now set the transition duration directly as the transitionDuration property on an element's style. Tested and working on iOS Safari, OSX Safari, Chrome and Firefox. e.g.

document.getElementById('container').style.transitionDuration = '500s';

See http://jsfiddle.net/jkoudys/xa2oo1us/

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top