Далее я собираюсь начать самую основную часть — написание программы на JavaScript. Наша идея состоит в том, что мы можем определить группу изображений (несколько изображений). При появлении страницы первое изображение будет отображаться первым, а второе изображение будет предварительно загружено через 5 секунд после загрузки первого изображения, если второе изображение. изображение также загружается, и мы начинаем автоматически переключаться на второе изображение. В это время предварительно загружается третье изображение. Если мы загрузим третье изображение в течение 5 секунд, мы автоматически переключимся на третье изображение, и воспроизведение продолжится. пока последний не начнет снова с начала. Конечно, это воспроизводится автоматически. Мы также разрешаем пользователям вручную воспроизводить вперед и назад.
В первую очередь, проблема, которую нам предстоит решить, это предварительная загрузка картинок, ведь от этого зависит плавность процесса переключения и совершенство процесса воспроизведения. Предварительно загрузить изображение очень просто. Нам нужно всего лишь создать в памяти новую переменную экземпляра изображения и указать эту переменную на изображение. Таким образом, наш браузер автоматически загрузит изображение. предварительная загрузка. Написанное на JavaScript это выглядит так:
var myImage = new Image()
myImage.src = "someImage.gif"
Затем нам также нужно знать, загружено ли изображение? Если он загружен, мы его отобразим, если не загружен, возникнет ошибка. Поэтому нам нужно изменить приведенный выше код и добавить два оператора, чтобы этот JavaScript стал следующим:
var img = new Image()
img.onload = doReadyImage
img.onerror = doErrorDisplay
img.src = "someImage.gif"
Мы добавили события onload и onerror изображения, которые определяют, следует ли предварительно загружать и предварительно загружать события ошибок соответственно. Эти два предложения должны находиться перед оператором img.src. В противном случае предварительная загрузка изображения пойдет не так.
Последний шаг — это наша программа переключения изображений. Ранее мы рассмотрели различные эффекты фильтров преобразования фильтров в CSS. Здесь мы используем случайный эффект под кодовым названием 23. Ниже мы написали для этого эффекта в программе IE:
if (document. images.slideShow.filters)
{
document.images.slideShow.filters[0].Stop()
document.images.slideShow.filters[0].Apply()
// Используем случайный эффект перехода document.images.slideShow.filters.revealTrans.transition=23
}
document.images.slideShow.src = sSource
//Начинаем выполнять эффект преобразования
если (document.images.slideShow.filters)
document.images.slideShow.filters[0].Play()