Give help. Get help.

  • # April 5, 2013 at 6:28 pm

    Hey All,

    I would like to Change the Body Background Every 10 sec and i have already something that does that…
    but it’s not working at all the monitors (i guess not the wide-screen) and what i have also it’s kinda heavy

    I just need a simple jquery code or something simpler to change the background image every 10 sec

    # April 5, 2013 at 10:53 pm

    what does it had to do with what i’m asking?

    i want like a slideshow of the body, i want that every 10 seconds the body of the css will load a different image

    body { background: url(image1.jpg); }
    body { background: url(image2.jpg); }

    first load image1.jpg… then after 10 seconds load image2.jpg, simple

    anyone can direct me ?

    # April 6, 2013 at 5:58 am

    There are also a number of Jquery plugins such as [This]( “”) which you can use, from here you can control the duration an image takes to carousel (10 seconds..)

    This what you were after?

    # April 6, 2013 at 6:03 am

    $(function() {
    var body = $(‘body’);
    var backgrounds = new Array(
    var current = 0;

    function nextBackground() {
    backgrounds[current = ++current % backgrounds.length]

    setTimeout(nextBackground, 10000);
    setTimeout(nextBackground, 10000);
    body.css(‘background’, backgrounds[0]);

    You don’t need to set the initial background in css, that’s what the last line is there for. That way you can keep all the backgrounds together, easier to maintain. :) You are not limited to background images, you can add colors and gradients to the array too.

    # April 6, 2013 at 6:23 am

    Change body’s ID/Class every 10 seconds. Each class/ID maps a specific background.

    I guess JS will be lighter than if you try to change the background dynamically.

    Quick example:

    # April 6, 2013 at 10:57 am

    @AdamHodgson – I’m using already ‘supersized’ but it doesn’t support all the monitors, if you having a widescreen probably you’ll see it good in all browsers, but old monitors it doesn’t do the stretch, but it’s not the issue , this plugin is too heavy for what i’m asking for.

    @CrocoDillon – Your code looks like something that i really need, but can you help me a little? i’ve tried to do that and i see nothing,
    i put the images in the same folder , how do the markup should look like?

    # April 6, 2013 at 6:06 pm

    Did you include jQuery? No special markup or css needed with that script.

    # April 7, 2013 at 2:56 am

    it has error on the second line that you wrote,
    can you check it please?

    # April 7, 2013 at 4:06 am

    Sorry, it’s working.. thanks!

    # August 26, 2014 at 5:09 am

    Hugo Giraudel, great. work….
    is it possible to change pictures with fade effect? If so…..this functions has no mistake! Can you help me please?

    # August 26, 2014 at 5:27 am

    yes…thx a lot…but it´s not behave as picture in body…:(

    # August 26, 2014 at 6:35 am

    but it´s not behave as picture in body

    Unfortunately, that’s not very clear.

    Perhaps you should start a new thread (this one is quite old) with more specific details of what you are trying to do.

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.