SetInterval can't see functions in Firefox

Question

I'm pretty new to JavaScript, so please forgive me if this is a stupid question. I am using the below code to get an image to slide onto the screen and 2 more images to appear one after the other. This works fine for Chrome and IE 7-9. Unfortunately, on Firefox I get an error saying:

move is not defined [ mover = setInterval(move, 1000); ]

My Code:

//define variables
var mover = 0
var bubble1move = 0
var bubble2move = 0


if(mover != 0)
{//interval is finished
    function move ()
    {   
        console.log("moving")
        clearInterval(mover)
        var moving_img = document.getElementById("i_sliding_image")
        var left = 0
        function frame() 
        {       
            left -= 2  // update parameters
            moving_img.style.left = left + 'px'// show frame
            if (left == -274) // check finish condition
            {
                clearInterval(id)                   
                bubble1move = setInterval(function() {bubble1()}, 2000);
            }
        }
        var id = setInterval(frame, 10) // draw every 10ms
    }       
}
if(bubble1move != 0)
{//interval is finished
    function bubble1()
    {
        clearInterval(bubble1move);     
        document.getElementById("img-bubble1").style.zIndex = "1";
        bubble2move = setInterval(function() {bubble2()}, 2000);
    }
}
if(bubble2move != 0)
{//interval is finished
    function bubble2()
    {
        clearInterval(bubble2move)
        var vBubble2 = document.getElementById("img-bubble2").style
        vBubble2.zIndex = "1";
    }
}
window.onload = function initialiser()
{
    mover = setInterval(move, 1000);//initial time to animation
}

All getElementByIds are getting div tags containing the images.

Thanks for your time.

Should your definition of move be inside the if statement? Try defining the function elsewhere and simply calling it from inside the if. — agryson, Nov 28 '12 at 11:36

score 2 · Answer 1 · answered Nov 28 '12 at 11:39

Looks like you are initializing your mover variable at the begining of your js to 0 and your if statement is only declaring the function if mover != 0. Initialize mover = 1; or take your function outside of the if statement(recommended). You're just trying to call move() before it exists

score 1 · Accepted Answer · edited May 23 '17 at 11:48

1

Move your function outside of the if. There is no reason for it to be within the if. It doesn't work on Firefox because of the way Firefox interprets functions (differently to other browsers).

See this question for more info.

Thanks to @freakish for the link.

edited May 23 '17 at 11:48

Community

1
1

answered Nov 28 '12 at 11:41

MrCode

63,975
10
90
112

This is incorrect: it doesn't work on FireFox, because FireFox interpretes `function` stetements a bit differently then other browsers ( under Chrome wherever you define function it will be always visible ). Read this for more details: http://stackoverflow.com/questions/4069100/why-cant-i-use-a-javascript-function-before-its-definition-inside-a-try-block It solves the problem, so I won't give -1, but I won't give +1 as well. – freakish Nov 28 '12 at 11:43
@freakish, thanks - added to answer. The solution remains the same though. – MrCode Nov 28 '12 at 11:46

SetInterval can't see functions in Firefox

2 Answers2