I've added a news ticker to a beta page i'm working on:
The width of the newsScroller div is calculated with the following:
<strong>Breaking news:</strong> Liverpool defeats AC Milan in a penalty shootout after a shock comeback from 3-0 down in the second half of the Champions' League final.
I'm using this ticker to replace a flash piece mainly because the flash piece can only carry a link to one url, but also because this degrades somewhat without js. The flash piece is running now on our home page:
var newsScroller = document.getElementById("newsScroller");
newsScroller.style.left = 0;
if (retrieveComputedStyle(newsScroller, "position") == "relative")
var relativeWidth = newsScroller.offsetWidth;
newsScroller.style.position = "absolute";
newsScroller.calculatedWidth = newsScroller.offsetWidth;
if (relativeWidth > newsScroller.calculatedWidth)
newsScroller.calculatedWidth = relativeWidth;
newsScroller.style.position = "relative";
newsScroller.calculatedWidth = newsScroller.clientWidth;
The problem is that when <a></a> tags or other html markup are introduced to the contents in the newsScroller div, it doesn't allow much content. I've tried it with the unordered list with <a> tags you can see in the beta version, and I also tried it with only <a> tags. Both approaches don't allow many more than three short text links to be presented ... anything more than that is truncated.
I'm hoping someone can tell me how to either:
modify the js so the newsScoller div's width is greater or:
help me find html markup that will allow longer and more text links.
Thanks for your help,