jquery плъзгачът променя позицията на фона

Мъча се да задам и променя позицията на фоновото изображение с помощта на плъзгача на jquery.

Моят плъзгач работи доста добре със следния код:

$(function() {
        $( "#slider" ).slider({
            value:5,
            min: 0,
            max: 10,
            step: 1,
            slide: function( event, ui ) {
                $( "#amount" ).val( ui.value );
            }
        });  
    $( "#amount" ).val( $( "#slider" ).slider( "value" ) );    
});

Сега обаче искам да променя позицията на фона на изображение. Добавих този код:

$(".beer_slider").css("background-position").val( $( "#slider" ).slider( "value" ) );

Но наистина нищо не се случва!

Някой посочи, че трябва да включа следните променливи:

var beer_slider = {
        "0": "-200px",
        "1": "-190px",
        "2": "-180px",
        "2": "-170px",
        "3": "-160px",
        "4": "-150px",
        "5": "-140px",
        "6": "-130px",
        "7": "-120px",
        "8": "-110x",
        "9": "-100x",
        "10": "-90x",
    };

Но не съм сигурен как да го нарека.

Всяка помощ се оценява