Динамическое изменение изображения jQuery src

Я просто удивлялся, как можно было бы менять src каждые 5 секунд,

я использую

$.backstretch("site.com/images/home5.jpg");

Можно ли заменить "home5.jpg" другим изображением (скажем, home6.jpg и home7.jpg), как слайд-шоу? Я не уверен, как изменить это динамически

5 ответов

Решение

Если вы хотите менять его каждые 5 секунд, вам нужно использовать setInterval():

var loop = 1;
setInterval(function() {
    var imgNumber = loop % 5; // assuming there are 5 images.
    $.backstretch("site.com/images/home" + imgNumber + ".jpg");
    loop++;
}, 5000);

ОБНОВИТЬ

После прочтения документации кажется, что эта функциональность уже встроена в плагин:

http://srobbin.com/jquery-plugins/backstretch/

Выберите "Использование backstretch в слайд-шоу" для кода.

Для этого вы можете использовать функцию JavaScript setInterval,

function slideSwitch () {

var $active = $('#slideshow IMG.active');

$active.src = //change src here (you can use array with src-s)// }

$ (function () {setInterval ("slideSwitch ()", 5000);});

Вы можете изменить html объекта, который вы выбрали, с помощью.html ().

$ (# thing).html ("");

Ты можешь использовать setInterval или аналогичная функция для периодического изменения изображения. Чтобы на самом деле поменять изображения, вы можете просто позвонить backstretch снова. Со страницы проекта:

Версия 1.2

Теперь вы можете вызвать backstretch дважды, и он заменит существующее изображение.

Так, например:

$.backstretch("site.com/images/home6.jpg");
Другие вопросы по тегам