Как да направите снимка на уеб страница с времето

Вграждането на JavaScript в HTML кодирането на уебсайта ви за бизнес представя нови методи за предоставяне на по-привлекателни формати. Например, можете да използвате JavaScript, за да завъртите серия от изображения на страницата за определен период от време. За да направите това, ще се възползвате от JavaScript функцията "setTimeout", която забавя действието на JavaScript и функцията "getElementbyID" на JavaScript обекта "document".

1.

Запазете серия от изображения в основната си директория на уебсайта. Този пример предполага, че имате общо четири образа, че са с еднакъв размер и че са маркирани последователно като "image1.jpeg", "image2.jpeg" и така нататък.

2.

Отворете HTML документа на уебсайта си и използвайте следния HTML код като база за показване на изображенията в етикетите "body". Това само дефинира първото изображение, което да се показва, и дава идентификатор на маркера на изображението:

3.

Вмъкнете следния JavaScript в маркерите на HTML документа, за да включите JavaScript в файла:

4.

Добавете следния код към JavaScript скриптовите тагове, за да декларирате променливи, които определят основната информация за ротация. "Текущата" променлива проследява текущото изображение в последователността, променливата "тотал" съхранява общия брой изображения за превъртане, а променливата "време" съхранява текущата итерация на функцията "setTimeout":

var current = 1; var total = 4; var time;

5.

Създайте две функции, "imageChanger" и "change", които се въртят последователно, като се сменят на всеки 5 секунди, използвайки функцията "setTimeout". Променете времето между комутаторите, като настроите втория аргумент на функцията "setTimeout", която е 5000 в този пример. Не забравяйте, че аргументът е в милисекунди, така че 1000 е равен на 1 секунда:

функция imageChanger () {time = setTimeout ("промяна ()", 5000); }

функция changeImage () {текуща ++;

if (текущо> общо) currPic = 1;

. ". JPEG" document.getElementById ( "образ") SRC = "образ" + ток +;

setupPicChange (); }

6.

Добавете следната команда към "body" таговете на HTML документа, който ще извика JavaScript функцията при зареждане на документа. Началният Ви маркер трябва да изглежда по следния начин: