DHTML Slide Player (iii)

Dhtml| Program | Underneath the slides, I'm going to start with the most central part of writing JavaScript programs. Our idea is that you can define a set of pictures (several), when the page appears first picture, and preload the second picture, the first picture loaded after 5 seconds, if the second picture is also loaded, we will begin to automatically switch to the second picture, and then preload the third picture, If we load the third picture in 5 seconds, we automatically switch to the third picture, so play until the last one starts again. Of course, it's played automatically. We also allow the user to manually forward and backward playback.

First, the problem we are trying to solve is the preload of the picture, because it determines the fluency of the switching process and the perfection of the playback process. To preload a picture is very simple, we just create a picture in memory of the instance variable, and the variable point to a picture, so that our browser will automatically load this picture, this is the image of the preload. Written in JavaScript is the following:

var myimage = new Image ()
MYIMAGE.SRC = "Someimage.gif"

Then, we also want to know, is the picture loaded? If loaded, we will show that if it is not loaded, then there will be a mistake. So we have to change the code above and add two statements to it, so this javascript becomes the following:

var img = new Image ()
Img.onload = Doreadyimage
Img.onerror = Doerrordisplay
IMG.SRC = "Someimage.gif"

We have added a picture of the onload and OnError events, representing, respectively, whether to preload and preload an error event. These two phrases must precede the IMG.SRC statement. Otherwise, there will be an error in the picture preload.

The last is our picture switch program, in the front, we reviewed the CSS Filter filter transformation of various effects, here we use code 23 random effect, below, we are in IE for this effect written JavaScript program:

if (document.images.slideShow.filters)
{
Document.images.slideshow.filters[0]. Stop ()
Document.images.slideshow.filters[0]. Apply ()
Using a random conversion effect
Document.images.slideshow.filters.revealtrans.transition=23
}

DOCUMENT.IMAGES.SLIDESHOW.SRC = ssource
Start the execution of the transformation effect
if (document.images.slideShow.filters)
Document.images.slideshow.filters[0]. Play ()