Grow your CSS skills. Land your dream job.

overwrite background.css code

  • # April 7, 2013 at 6:24 am

    Regarding to my question here that has been solved:
    http://css-tricks.com/forums/discussion/23934/change-body-background-every-10-sec#Item_10

    $(function() {
    var body = $(‘body’);
    var backgrounds = new Array(
    ‘url(image1.jpg)’,
    ‘url(image2.jpg)’
    );
    var current = 0;

    function nextBackground() {
    body.css(
    ‘background’,
    backgrounds[current = ++current % backgrounds.length]
    );

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

    This code working fine, but if you check the value that i get on FIREBUG
    i guess it gives me the default properties:

    background: url(“image1.jpg”) repeat scroll 0% 0% transparent;

    and i would like to overwrite these properties to

    background: url(“image1.jpg”) no-repeat fixed center center transparent;

    I hope it’s clear what i’m asking, do you have any idea how can i make that?

    # April 7, 2013 at 6:50 am

    using shorthand background declarations should be fine(dont know exactly browser support)

    change

    body.css(
    ‘background’,
    backgrounds[current = ++current % backgrounds.length]
    );

    to

    body.css(
    ‘background’,
    backgrounds[current = ++current % backgrounds.length]+’ no-repeat fixed center center’
    );

    otherwise change each attribute one by one . jquery css function accepts an object too

    # April 7, 2013 at 8:19 am

    Thanks

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".