Home/ Questions/Q 8770457
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T17:33:45+00:00

I was trying to make a red bar (created with a div and a

  • 0

I was trying to make a red bar (created with a div and a red background-color) that can extend from 0 pixels in width to 200 pixels in width. My code works when I insert a window.alert(x.width) in the function myF(), but the code doesn’t give me a transition when I don’t put it in. Is it just a problem with the setTimeout()?

<!DOCTYPE html>
<html>
   <head>
      <script>
         function myF(){
          var x = document.getElementById("bar1").style;
            if(parseInt(x.width)<200){
             x.width = (parseInt(x.width)+1)+"px";
             setTimeout(myF(),1);
            }
         }
      </script>
   </head>
   <body onload="myF()">
      <div id="bar1" style="width:0px; text-align:center; height:10px;background-color:red; font-size:10px; padding:0px; margin:0px;"></div>
   </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    you should do :

    setTimeout(myF,1);

    instead of :

    setTimeout(myF(),1);
    • 0