I have a simple carousel to display some images. As you would expect that the carousel auto rotates every x seconds.
I currently have a div that I animate the width of X seconds to show progress, allows users to see how much longer they have to wait until the next image is displayed. When a user rotates on the image, the progress bar falls when they come out of the mouse, then it starts replenishing.
However, instead of using a boring bar, I wanted to try a circle like a spinning wheel, which you are seeing when loading AJAX. I have no idea how to do this.
Can anyone help? Is this possible?
Produce a series of images representing different degrees that you want to represent, As you wish, you can represent images that represent four% of images, 0%, 25%, 75%, and 100% "progress" or 100% each 1% difference.
Instead of changing the width of a bar in JavaScript, you can swap in the appropriate image for the current amount of progress. if (progress and lieutenant; 25) image = '0percent.png'; (et cetera).
With HTML5 support, it will be possible to do this without using images on some modern browsers, but anywhere completely unrealistic.
Note that this is quite different from standard "load" graphic. They do not represent spinner progress because they spin frequently until the document is loaded. Spinners are therefore created in the form of animated GIFs, so sit on a single image page and sit happily until it is removed.
Comments
Post a Comment