background top/down

by Cheffchen

HTML

<script src="http://snook.ca/technical/jquery-bg/jquery.bgpos.js"></script>
<div id="header"></div>

CSS

#header {
    background-image: url("http://www.google.com/logos/2013/st_davids_day_2013-1060005-hp.jpg");
    background-position: left top;
    background-repeat: no-repeat;
    height: 230px;
    width: 1000px;
}

JavaScript

$(document).ready(function(){
    
    setInterval(function() {
    $('#header').stop()
        .animate({backgroundPosition:"(0px 100px)"}, {duration:2000})
        .animate({backgroundPosition:"(0px -100px)"}, {duration:2000});
    }, 4000);  


});