background-position bottom parseInt

Question

I have a script for animating a background-position while scrolling.

The background-position of the image: center bottom.

When scroll the script will start from the center top position.

Any idea how it will start with parseInt from the bottom background-position? I have looked all over but cant find what to do.

<script> 
$(window).scroll(function() { 
    var x = $(window).scrollTop(); 
        $('.container_image).css('background-position', 'center ' + parseInt(-x / -3) + 'px');
 }); 
</script>

div .container_image{
background-image: url("../images/image.jpg");
background-position: 50% bottom;
background-color:#fff;
min-height:325px;
height:325px;
-moz-transition: height 0.3s ease 0s;}

Answer 1

Calculating the value beforehand would work to fix your problem.

var newPos = (-x/-3);
$('.container_image').css('background-position', 'center ' + newPos + 'px');

or as Thomas suggested

$('.container_image').css('background-position', 'center ' + (-x/-3) + 'px');

would also work.