News Ticker

Hightower · 08-17-2009, 10:24 AM

I have got the following code for jQuery (can't remember where from):

javascript Code:

var headline_count;
var headline_interval;
var old_headline = 0;
var current_headline = 0;
    
$(document).ready(function(){
    headline_count = $("div.headline").size();
    $("div.headline:eq(" + current_headline + ")").css('top', '5px');

    headline_interval = setInterval(headline_rotate,5000);
    $('#scrollup').hover(function() {
        clearInterval(headline_interval);
    }, function() {
        headline_interval = setInterval(headline_rotate,5000);
        headline_rotate();
    });
});

function headline_rotate() {
    current_headline = (old_headline + 1) % headline_count;
    $("div.headline:eq(" + old_headline + ")")
        .animate({top: -205},"slow", function() {
            $(this).css('top', '210px');
        });
    $("div.headline:eq(" + current_headline + ")")
        .animate({top: 5},"slow");  
    old_headline = current_headline;
}

It scrolls through any divs with a headline class, displaying each one in turn.

It works nicely except when I first load the page every headline is displayed. Can anybody help me modify the jQuery code so that every headline apart from the first is hidden when the page is initially loaded.

Salathe · 08-17-2009, 10:41 AM

Source: http://www.learningjquery.com/2006/1...eadline-reader

Hightower · 08-17-2009, 11:15 AM

Thanks - checked my code with that and I can't see any differences... So why do all my items show when the page loads instead of hiding all but the first one?