Search code examples
jquerydynamicslideshowjquery-backstretch

Change jQuery image src dynamically

I saw just wondering how it would be possible to change a src every say 5 seconds,

I am using 

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

Is it possible to swap 'home5.jpg' with other image (say home6.jpg and home7.jpg) like a slideshow? I'm not sure how to change it dynamically

Solution

  • If you wanted to change it every 5 seconds you'd need to use setInterval():

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

    UPDATE

    After reading the documentation it appear this functionality is built into the plugin already:

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

    Choose 'Using backstretch in a slideshow' for the code.