views:

742

answers:

1

Hey,

My site is here: http://treethink.com

What I have going is a news ticker on the right that is inside a jquery function. The function starts right away and extracts the news ticker and then retracts it as it should. When a navigation it adds a class to the div, which the function then checks for to see if it should stop extracting/retracting. This all works great.

The problem I am having is that after the close button is clicked (in the content window), the removeClass won't work. This means that it keeps thinking the window is open and therefore the conditional statement inside the function won't let it extract and retract again. With a simple firebug check, it's showing that the class isn't being removed period.

It's not the cboxClose id that it's not finding because I tried changing that to just "a" tags in general and it still wouldn't work so it's something to do with the jQuery for sure. Someone also suggested a quick alert() to check if the callback is working but I'm not sure what this is.

Here is the code:

/* News Ticker */

    /* 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 */

            });

            $("#ticker").stopTime();

        }

    }

    /* 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

+1  A: 

The version of the code on your site is different to what you've copied here.

The version on the live site has:

$("a").click(function() {

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

    newsTicker();

});

instead of what you've copied here:

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

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

    newsTicker();

});

I can confirm that the live site code doesn't run (used a Chrome Developer Console breakpoint to check).

As another aside, consider upgrading your Jquery to the latest 1.4.2, this will pick up any other bugs that are affecting your code.

Alastair Pitts
I updated the site but regardless it definitely doesn't work. I'll try updating jQuery but I'm not sure if that will break it, there are some things in there that might be dependent on specific versions.
Wade D Ouellet
Alright the update worked fine, didn't fix the issue though.
Wade D Ouellet
It seems that no matter what link I attach the removeClass to it won't work, I tried attaching an addClass to there as well and it wouldn't work. Which means the problem isn't the link and isn't the removeClass...It's something else.
Wade D Ouellet
have you stepped through your JS code in Chrome or Firebug (I'm assumimg firebug has JS debugging). Add break points everywhere and see when things are being run. I had another look at your site just now but the code in question had been commented out so I couldn't test it again.
Alastair Pitts