开发者

Jquery hasClass conditional not working

I am trying to make it so when a navigation item is clicked, it retracts the news ticker on the right and then doesn't run any of the extracting/timer functions anymore. I got it to retract but it still extracts.

How I am doing it is I am adding a "noTicker" class with the nav buttons and removing it with colorbox's close button. The function runs on the page initially and if there isn't a "noTicker" class it runs the news ticker as planned. When a nav or close button is clicked it runs the function again which checks again to see if it has that class.

So if it has the class it should retract (which it is so that must mean it's adding the class properly) and then not run any of the timer functions, but it still runs the timer functions for some reason. Here is my jQuery. It is also not removing the class properly when the close button is clicked, according to firebug.

/* Initially hide all news items */

$('#ticker1').hide();
$('#ticker2').hide();
$('#ticker3').hide();

var randomNum = Math.floor(Math.random()*3); /* Pick random number */

newsTicker();

function newsTicker() {

    if (!$("#ticker").hasClass("noTicker")) {

        $("#ticker").oneTime(2000,function(i) { /* Do the first pull out once */

            $('div#ticker div:eq(' + randomNum + ')').show(); /* Select div with random number */

            $("#ticker").animate({right: "0"}, {duration: 800 }); /* Pull out ticker with random div */

        });

        开发者_开发技巧$("#ticker").oneTime(15000,function(i) { /* Do the first retract once */

            $("#ticker").animate({right: "-450"}, {duration: 800}); /* Retract ticker */

            $("#ticker").oneTime(1000,function(i) { /* Afterwards */

                $('div#ticker div:eq(' + (randomNum) + ')').hide(); /* Hide that div */

            });

        });

        $("#ticker").everyTime(16500,function(i) { /* Everytime timer gets to certain point */

            /* Show next div */

            randomNum = (randomNum+1)%3;

            $('div#ticker div:eq(' + (randomNum) + ')').show();

            $("#ticker").animate({right: "0"}, {duration: 800}); /* Pull out right away */


            $("#ticker").oneTime(15000,function(i) { /* Afterwards */

                $("#ticker").animate({right: "-450"}, {duration: 800});/* Retract ticker */

            });

            $("#ticker").oneTime(16000,function(i) { /* Afterwards */

                /* Hide all divs */

                $('#ticker1').hide();
                $('#ticker2').hide();
                $('#ticker3').hide();

            });

        });

    } else {

        $("#ticker").animate({right: "-450"}, {duration: 800}); /* Retract ticker */

        $("#ticker").oneTime(1000,function(i) { /* Afterwards */

            $('div#ticker div:eq(' + (randomNum) + ')').hide(); /* Hide that div */

        });

    }

}

/* when nav item is clicked re-run news ticker function but give it new class to prevent activity */

$("#nav li").click(function() {

    $("#ticker").addClass("noTicker");

    newsTicker();

});

/* when close button is clicked re-run news ticker function but take away new class so activity can start again */

$("#cboxClose").click(function() {

    $("#ticker").removeClass("noTicker");

    newsTicker();

});

Thanks,

Wade


It doesn't look like your everyTime() timer will get cancelled when you add the noTimer class to your #ticker div. The first call to newsTicker() will presumably set this going, however, I don't see that subsequent calls will stop it.

If I am reading the correct documentation, you can give your timer a (string) label, then to stop it you can call stopTime() and supply the label.

Here is the documentation I am working from: http://plugins.jquery.com/project/timers

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜