Background Animation

This demonstrates animating the background with jQuery

by Kai Carver

HTML

<div id="test" style="width: 400px; height: 400px; border: 1px solid red;"></div>

JavaScript

jQuery(function(){
    // @2010 JasonLau.biz
    var travelDelay = 1000,
        travelInterval = 2000;
    $('#test').css({'background': 'url(http://jasonlau.biz/public/examples/example.images/space.jpg) no-repeat 50% 50%'});
    var moveIt = function(){
        
        var ex = Math.floor(Math.random()*100) + '%',
            why = Math.floor(Math.random()*100) + '%';

        $('#test').animate({'background-position': ex + ' ' + why}, travelDelay);
            
             
     };
     var myInterval = window.setInterval(moveIt, travelInterval );
    
});