How to create a sequence of functions?

I tried to do

myfun(params,
   function(){
       //something happen
   }
);

but it is not working, and I absolutely do not know why, and I am going crazy. I am still banging m开发者_如何学Goy head on a problem after several weeks, and I need really an help because I am not so good at Jquery syntax.

What I am trying to achieve is: Starting a function that check if you are hovering inside a circle area, if you do than trigger a sequence of function, one after another (in this case showing a series of animation). And I cannot make "one after another".

I am trying to do this, because in safari when you make a link round with radius-border, and you want to hover on the element, it still behave as a square. And I would like not to use image-maps.

As well I cannot re-use the same function to check the hovering inside a circle area more than once (do not ask me why, I tried to understand but I am not clever enough or able enough to comprehend), so my only last resource it is to try to trigger an event based on a sequence.

aniCircle it is the function where I want to nest my sequences of animations. This it is how does it look the function:

$("#cv").hover( 
    function(){
        $("#sliders .circle").css("z-index","6");

        aniCircle(1, $(this), "#slider1", {"opacity":"0"},{"opacity":"1"}, 0, speed2, 
            function(){$("#slider2").delay(speed2).animate({"opacity":"1"},speed2)}
        );

    },
    function(){

        $("#slider1").animate({"opacity":"0"},speed2)
        $("#slider2").delay(speed2).animate({"opacity":"0"},speed2)

    }
);

Here there is the webpage http://life-is-simple.co.uk/test5/index.html

Remember on FF4 it works fine the circle area, it is on webkit browser that it doesn't and I want to fix it using JS.

Thank you for all your help

I think using jquery .queue() can resolve your problem.

jQuery animate() takes a "complete" callback. You can nest the sequence like:

$("#slider1").animate(
    {"opacity":"0",
     "speed": speed2,
     "complete": second_animation
    }
 );

function second_animation() {
 $("#slider2").animate()...
}

The slider2 animation will not begin until the slider1 animation is complete.

It looks like you are trying something like:

var outer = function(){
var  test = function(){
    alert('fired 1');
}()
var  test2 = function(){
    alert('fired 2');
}()
}

Notice the '()' after the method declaration which makes it fire immediately. These will fire one after the other, but if you apply code to them that will fire asynchronously, then you will need to use a callback method.

JavaScript does not have "function sequences" by default. jQuery's animate() can handle callback functions because it's coded to call the callback function when the animation is complete.

I think you're looking for something like:

function setupThenCall(param1, param2, fn) {
    // do some setup / processing

    // call callback function after setup
    fn();
}

If you're doing something more complicated, e.g. multiple levels of callbacks, you may want to use jQuery's queue().

I am sorry but I have to remake the question later on in the future, I noticed that without a more straightforward example, and without having time to dedicate to my website (I found myself fairly busy on various projects all week long and even after normal working hours), I do not want to keep my question open just for the sake of keeping open without trying and testing your solutions suggested.

I am sorry for the losing time that I have made you spent on this question. I'll try to be better organised in the future. Thank you very much for your time.

I tried to closed it, but couse of the bounty I cannot close it :(