Monday, March 19, 2012

a more interesting news ticker

So it's been a little while since I've done a live demo here.

The other week on some website or other -- it might have a Sky-affiliated site? -- I saw a little news ticker that caught my attention. I created a simple mockup of its main action here-- go ahead and hit "ticker it"...

Now I've seen plenty of newstickers, even scrolling ones, but this was a little different: rather than being a simple thing that always scrolls, it starts at the left and builds to the right, only scrolling enough to keep the right edge visible, and the stopping the scroll. It ain't rocket science, but I find it a more natural way of reading than a traditional ticker... the user gets less impatient as the text builds in a more "normal" fashion, but still the animation makes it more engaging than a simple static headline (even one in those garish colors-- I believe yellow and black combo is thought to be the highest and most attention grabbing possible.) The construction invites the user to just keep looking, and builds a bit of suspense with what word comes next.

 You can see my rendition of this on a standalone page, and view the source thereof, but there isn't that much to it, just some simple nested divs with hidden overflow and then some setTimeout javascript to adjust the relative positioning when jQuery's "width()" function indicates things are too long.

No comments:

Post a Comment