Add jquery cookie to background changer

Question

Hey guys need much appreciated help.. I have tried to add cookies to the following Jquery body background changer code using the Jquery cookie plugin to no avail. The code works fine just no cookies to retain selection.

Thanks a lot everyone.

jQuery('#stlChanger .stBgs a').click(function(){
    var bgBgCol = jQuery(this).attr('href');
    jQuery('#stlChanger .stBgs a').removeClass('current');
    jQuery('body').css({backgroundColor:'#ffffff'});
    jQuery(this).addClass('current');
    jQuery('body').css({backgroundImage:'url(' + bgBgCol + ')'});
    if (jQuery(this).hasClass('bg_t')){
        jQuery('body').css({backgroundRepeat:'repeat', backgroundPosition:'50% 0', backgroundAttachment:'scroll'});
    } else {
        jQuery('body').css({backgroundRepeat:'repeat', backgroundPosition:'50% 0', backgroundAttachment:'scroll'});
    }
    return false;
});

Answer 1

Try

jQuery('#stlChanger .stBgs a').click(function(){
    var bgBgCol = jQuery(this).attr('href');
    jQuery('#stlChanger .stBgs a.current').removeClass('current');

    jQuery('body').css({backgroundColor:'#ffffff'});
    jQuery(this).addClass('current');
    jQuery('body').css({backgroundImage:'url(' + bgBgCol + ')'});

    //Assuming this is how the cookie value is set in your cookie plugin
    //We set the href value of the clicked element to the cookie, since it is the only identifier to identify the clicked element
    $.cookie('stlchanger-bg', bgBgCol)

    if (jQuery(this).hasClass('bg_t')){
        jQuery('body').css({backgroundRepeat:'repeat', backgroundPosition:'50% 0', backgroundAttachment:'scroll'});
    } else {
        jQuery('body').css({backgroundRepeat:'repeat', backgroundPosition:'50% 0', backgroundAttachment:'scroll'});
    }
    return false;
});

jQuery(function($){
    //When the page is reloaded the cookie value is read and we trigger a click event on the matched anchor element
    var bgBgCol = $.cookie('stlchanger-bg');
    if(bgBgCol){
        jQuery('#stlChanger .stBgs a[href="' + bgBgCol + '"]').trigger('click');
    }
})