Home/ Questions/Q 9144715
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T10:20:15+00:00

I read 5 tutorials about how to start a CSS-Transition with JavaScript, but it

  • 0

I read 5 tutorials about how to start a CSS-Transition with JavaScript, but it doesn’t work.
I’m using Safari.
Here’s my Code:

<html>
<head>
<title>Test</title>
<style type="text/css">
    #test{
        width: 100px;
        height: 100px;
        background-color: aqua;
        transition: width 3s linear;
    }
</style>
<script type="text/javascript">
    function test(){
        document.getElementById('test').style.width = 200+'px';
    }
</script>
    </head>
    <body>
      <div id="test">
      </div>

      <button onclick="test()">Los</button>
    </body>
    </html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You may need to use vendor prefixes, safari uses webkit so try addind the -webkit- prefix.

    <style type="text/css">
    #test{
        width: 100px;
        height: 100px;
        background-color: aqua;
        -webkit-transition: width 3s linear;
        -moz-transition: width 3s linear;
        transition: width 3s linear;
    }
</style>

    DEMO

    • 0