jquery animation from right to left
<p>I am trying to make an animation(Please tell me if my approach is correct) with using css sprites, please check following jquery code...</p>

<pre><code>$(document).ready(function() {
    setTimeout("boat()",20);
});
function boat(){
    $("#boat").animate({right:"+=110%"},20000).css("background-position","0 0").animate({left:"+=110%"},20000).css("background-position","0 -68px")
    setTimeout("boat()",20000);
}
</code></pre>

<p><strong>css:</strong> </p>

<pre><code>#boat {
    margin-top:160px;
    position:absolute;
    margin-left:100%;
    width:150px;
    height:68px;
    background-image:url(plane.png);
    background-repeat:no-repeat;
}
</code></pre>

<p>Animation works perfect(Right to left and left to right) but there is small issue, css sprite is not working as expected. Its only taking this property <code>.css("background-position","0 -68px")</code></p>
