Als nächstes beginne ich mit dem wichtigsten Teil, nämlich dem Schreiben eines Javascript-Programms. Unsere Idee ist, dass wir eine Gruppe von Bildern (mehrere Bilder) definieren können, das erste Bild wird zuerst angezeigt und das zweite Bild wird 5 Sekunden nach dem Laden des zweiten Bildes vorgeladen Das Bild wird ebenfalls geladen und wir beginnen automatisch mit dem Wechsel zum dritten Bild. Wenn wir das dritte Bild innerhalb von 5 Sekunden laden, wechseln wir automatisch zum dritten Bild bis der letzte wieder von vorne beginnt. Dies wird natürlich automatisch abgespielt. Wir ermöglichen Benutzern auch die manuelle Vorwärts- und Rückwärtswiedergabe.
Das Problem, das wir zunächst lösen müssen, ist das Vorladen von Bildern, da dies den reibungslosen Umschaltvorgang und die Perfektion des Wiedergabevorgangs bestimmt. Es ist sehr einfach, ein Bild vorab zu laden. Wir müssen lediglich eine neue Instanzvariable im Speicher erstellen und die Variable auf ein Bild verweisen Vorladen. In Javascript geschrieben sieht es so aus:
var myImage = new Image()
myImage.src = „someImage.gif“
Dann müssen wir auch wissen, ob das Bild geladen ist? Wenn es geladen ist, wird es angezeigt. Wenn es nicht geladen ist, tritt ein Fehler auf. Wir müssen also den obigen Code ändern und zwei Anweisungen hinzufügen, sodass dieses JavaScript wie folgt aussieht:
var img = new Image()
img.onload = doReadyImage
img.onerror = doErrorDisplay
img.src = „someImage.gif“
Wir haben die Ereignisse onload und onerror des Bildes hinzugefügt, die angeben, ob Fehlerereignisse vorab geladen werden sollen. Diese beiden Sätze müssen vor der img.src-Anweisung stehen. Andernfalls geht das Vorladen des Bildes schief.
Der letzte Schritt ist unser Bildwechselprogramm. Zuvor haben wir die verschiedenen Effekte von Filterkonvertierungsfiltern in CSS überprüft. Hier verwenden wir den Zufallseffekt mit dem Codenamen 23. Nachfolgend finden Sie, was wir für diesen Effekt im IE-JavaScript-Programm geschrieben haben
. images.slideShow.filters)
{
document.images.slideShow.filters[0].Stop()
document.images.slideShow.filters[0].Apply()
// Zufälligen Übergangseffekt verwenden document.images.slideShow.filters.revealTrans.transition=23
}
document.images.slideShow.src = sSource
//Mit der Ausführung des Konvertierungseffekts beginnen
if (document.images.slideShow.filters)
document.images.slideShow.filters[0].Play()