Changing page background via Javascript

Question

I have been trying to get this to work for the past 6 hours and I am just unable to do it right. I've looked at the questions and solutions on SO as well to no avail. What am I doing horribly wrong?!?

All I have is a html5 page with no background. In my javascript code I call upon this method when the document is ready:

/*
 * Initializes the landing page.
 */
function initializeLanding(){
    $('body').css({
        'backround':'url("http://40.media.tumblr.com/290e7a272b492735ddf8cd968e657d05/tumblr_nhmg6xYnv41u7ns0go1_1280.jpg")'
    });
}

It should be something stupidly simple, and yet here I am. I've tried using single quotes, double quotes, without multiple attributes, etc. I would also much rather not use CSS or DOM properties to change the background, as I have set up way points along the page to change the background upon scrolling past them.

Also, if I call the .css() method and put in new attributes, will it overwrite all the old ones, or just the stated attributes in the latest css() call?

Update: here is where I call the function:

  var main = function(){                                                          
      $(".owl-carousel").owlCarousel();                                           
      lorem();                                                                    
      initializeLanding();                                                        
  }                                                                               
  $(document).ready(main);

have you put the initializeLanding() function in the $(document).ready(function(){}); ? — Manu Zi
– Manu Zi, Commented Apr 2, 2015 at 5:48

sachin.ph · Accepted Answer · 2015-04-02 05:49:33Z

7

you have a spelling mistake.

backround => background.

answered Apr 2, 2015 at 5:49

sachin.ph

1,07812 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Toni_Entranced Over a year ago

I knew it was something stupid. It's probably time to give myself a break.

Nishit Maheta · Accepted Answer · 2015-04-02 06:03:06Z

3

check this demo

you have a spelling mistake. replace backround to background

 function initializeLanding(){
    $('body').css({
    'background':'url("http://40.media.tumblr.com/290e7a272b492735ddf8cd968e657d05/tumblr_nhmg6xYnv41u7ns0go1_1280.jpg")'
    });  
  }

edited Apr 2, 2015 at 6:03

answered Apr 2, 2015 at 5:52

Nishit Maheta

6,0413 gold badges19 silver badges32 bronze badges

2 Comments

Toni_Entranced Over a year ago

I don't know why people downvoted you so much. I would've picked your answer just fine too.

Nishit Maheta Over a year ago

@Manoz it just delay when i am creating fiddle :). so Tonimiko understand what is wrong in code with example :)

Collectives™ on Stack Overflow

Changing page background via Javascript

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related