JQuery Waypoints Assistance

Question

I've been out of web design for quite a while and someone has asked me for help on reproducing this effect: http://www.jetsetter.com/destinations/italy?nm=destinations

I've gotten pretty close here with someone else's help, but now I can't get the background to change. It works when I change background-color, but not background-image.

Can someone take a look and see what I missed?

http://jsfiddle.net/pfwwv/28/

$(document).ready(function(){
// attach a waypoint to each div.waypoint element
// the callback is executed every time the user scrolls past 
// see http://imakewebthings.com/jquery-waypoints/#docs
$('.waypoint').waypoint(function(direction){
    // you can use the direction parameter here to check which way the user was     scrolling if you need

    // get the background-image source from the data-src property on the DOM element
    var backgroundSrc = $(this).attr('data-src');

    // now update the CSS for the body
    $(document.body).css({
     'background-image': backgroundSrc
    });
 });

});

Answer 1

$(document.body).css({
    'background-image': 'url(' + backgroundSrc + ')'
});

Setting background-image using jQuery CSS property