[Javascript] Horizontal scroll

[Flavio Gomes]

I'm not sure of what exactly was your problem, but as I had some spare 
time I did what you asked..
  Feel free to ask something else you may need in JavaScript.


<style>
#foo {
width: 770;
height: 58px;
}
</style>


<div id=foo style="background:url('foo.jpg') repeat-x;">
</div>

<script>

function rollBackground(id, x, y, t)
//scrolls an objects background
{
  // id >> Id of the Object
  // x   >> Amount of px to roll in horizontal
  // y   >> Amount of px to roll in vertical
  // i   >> Interval of time between each increment
  obj = document.getElementById(id)
  if (obj.style)
  { bgPos = obj.style.backgroundPosition.split(' ');
    X     = parseInt(bgPos[0]);
    Y     = parseInt(bgPos[1]);
    obj.style.backgroundPosition = (X+x)+"px "+(Y+y)+"px";
  }

  setTimeout("rollBackground('"+id+"', "+x+", "+y+", "+t+")", t);
}

rollBackground('foo',-86,0,500)

</script>


--
Flavio Gomes
flavio at economisa.com.br


Scott Hamm wrote:

>I've been struggling to write a JavaScript that horizontally scrolls image
>using CSS as follows:
>
>#foo {
>width: 770px;
>height: 58px;
>background:url(foo.jpg) repeat-x top [javascript incremented by -86px per .5
>seconds];
>}
>
>
>Or as follows:
>
>#foo {
>width: 770px;
>height: 58px;
>}
>
><div id=foo style="background:url(foo.jpg) repeat-x top [javascript
>incremented by -86px per .5 seconds];">
></div>
>
>That way scroll will recycle perfectly in synch when end of image is
>reached.
>
>Any ideas?
>  
>