TickerTape News Component Update

May 8th 2007, 4:53 pm in Javascript, Projects, TickerTape.

I’ve updated my javascript TickerTape to version 1.1, and introduced a couple of new features. Firstly, one which was requested by a few people, rolling over the ticker now causes it to stop scrolling until you move out again. This prevents the item you’re interested in zipping off the screen before you can click it.

Secondly, the ticker can now be configured to scroll horizontally, which opens up a whole new slew of applications. You can see both of these features in action in the new horizontal demo. The current version of the TickerTape component can always be found here:

Latest JavaScript TickerTape Component

Incidentally, because IE7 doesn’t allow XMLHttpRequests to the local filesystem, you’ll have to upload the demos to your own webserver rather than view them on your own PC. They work locally in Firefox just fine.

Responses to “TickerTape News Component Update”

  1. Hi Colin

    Your ticker is wonderful and very configurable - smooth scrolling too :)
    Only one thing - it seems to take an awful lot of CPU time in Firefox - is this
    a firefox thing or is there somewhere in the .js I can tweak the amount of
    work that is going on?

    Thanks again for all your hard work which must have gone into this..
    It is not taken for granted :)

    Sam
    Finland

    Sam

  2. Hi Sam,

    I’m not seeing this in FF3, and didn’t see it in FF2 either as far as I can remember. The scroll function starts on line 188 of the main tickertape.js file if you want to take a look, but you’re the first to mention this issue, so maybe the problem lies in your local machine?

    Colin Ramsay

  3. It is using a 20ms timout which is pretty much a tight for loop even on modern fast machines. I was at an o2.ie website and laptop fan came on, cpu to 100% and battery started to drain. Tracked the code down to coming from here. There’s a price to pay for smooth scrolling. Colin - I think you should reduce CPU demands of your script. Thx anyway - nice bit of js.

    Tony Jewell

  4. For use in Opera >= 9, use it inside a div, or you will get the page to scrool in some situations.
    So something like this should work just fine:

    var ticker = new TickerTape(’demo-data.txt’, ’styledTickerTape’, 4000);

    Notice the properties position, width and height! Also combine the desired width and height in the css TickerTape file.

    Hope this helps.

    =IceBurn=

  5. Ups… the blog strips HTML tags….

    So, what you should do is put the javascript calls inside a div with the following properties:

    position: absolute;
    width: 150px;
    height: 140px;

    Cheers.

    =IceBurn=

  6. Just notice, it has a bug in IE 7. It’s like it always add 1px to the height to scroll up.
    Works fine in Opera and FF.

    =IceBurn=

Post a Reply