Changing webkit transition duration using javascript on iPad?

11,825

Solution 1

Can be done with:

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

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

Solution 2

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/

Share:
11,825
Tarek
Author by

Tarek

Updated on June 18, 2022

Comments

  • Tarek
    Tarek almost 2 years

    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?