[thelist] Scrolling ticker

Robert Gormley robert at pennyonthesidewalk.com
Thu Jun 7 12:15:21 CDT 2007

First, a caveat, no "JS is evil, mmmkay" style comments, please.

I'm trying to work out a garden variety scrolling ticker, you know the kind:

| < | text here scrolls in from right out to left ... text here | > |

Easy enough to do, so far.
onMouseOver stops scroll, mouseOut starts...

still simple.

Content of ticker is in div and named elements for "dynamic injection"

<div id="tickerbody">
    <a name="act1">&bull;</a> Act 1 - City 1
    <a name="act2">&bull;</a> Act 2 - City 2
    <a name="act3">&bull;</a> Act 3 - City 3

Now, as the ticker scrolls, behavior for buttons should be |>| to jump 
to next item, and |<| for previous. This in itself is doable in JS - 
walk the DOM tree for <A> children of #tickerbody. Display next, if at 
end, go to 1, and vice versa.

But how do we know which is next, I hear you ask, and this is my problem.

Because of course it's easy if the buttons are the only way to advance 
things, but the thing is scrolling of its own accord too.

My vague theorizing thus far:

The DIV is much bigger than its viewport, and we're scrolling by 
adjusting its position, pulling it through x pixels every x msec.

If I could walk the DOM tree and get left value for each A (can't do it 
on char count, because of proportional fonts, etc), then I could 
determine which is "next" by finding which one is just outside of the 
right of the viewport, and previous by the one which is just outside of 
the left of the viewport, because I know the current offset of the DIV, 
as I'm using it for scrolling.

Is this feasible? Is it possible? I'm utterly sure that I've seen 
implementations like this, though of course now I can't find any having 
been put on the spot.

Anyone able to confirm? Deny? Point me to an example? Show a simple 
implementation, even a line or two of JS that'd need to be plugged into 
a bigger "engine"? Offer alternate theory as to how this could be made 
to work?

Help as always greatly appreciated.


More information about the thelist mailing list