Web Hosting Talk : Web Hosting Main Forums : Web Design and Content : JS: How to refresh a div in javascript WITHOUT jquery/ajax

[Mister Bark]

Hi!

I just made a simple javascript code that slides a div in another one by changing its css "left" property with a timer.

If I put an alert() at each loop, I see the animation of the div step by step at each alert message.
But if I remove the alert(), there is no animation, it goes straight to the end position, so I guess the problem is that the div needs some kind of refresh.
But I don't know how to do that!

PLEASE, I DO NOT WANT TO USE ANY MODULE such as ajax or jquery. I am sure there is a simple solution to do this.

Thanks a lot for your help!


HERE IS MY TEST PAGE :
http://img.misterbark.com/misterbark-homela-test.html

And the same without alert() :
http://img.misterbark.com/misterbark...t-noalert.html

[Sam [Vissol]]

Personally I'd just use some CSS3.

#pagesky {
-moz-transition: left 0.5s;
-webkit-transition: left 0.5s;
transition: left 0.5s;

[Mister Bark]

Thanks but the point is to control it with the NEXT and PREVIOUS buttons

[Sam [Vissol]]

Originally Posted by Mister Bark

Thanks but the point is to control it with the NEXT and PREVIOUS buttons

You can

[Mister Bark]

oh really??? how

Otherwise, I found a solution that works :
http://img.misterbark.com/misterbark...a-test-ok.html

apparently setTimeout is not nice, I used setInterval here.

[Sam [Vissol]]

Originally Posted by Mister Bark

oh really??? how

Just add the code I posted to your CSS and it will work perfectly!

[Mister Bark]

hmm I see that's great hehe
So you basically use javascript only to change the left property and the movement is smooth cool

But the problem is always the same.... internet explorer.... I have to be a stupid programmer because internet explorer is stupid...