Search code examples
jquerysettimeouthighlight

jQuery highlight on settimeout


I have this script:

function nudge(){
$("#info").animate({left:"+=5px"},40).animate({top:"+=5px"},40).animate({top:"-=10px"},40).animate({left:"-=10px"},40)
    .animate({top:"+=5px"},40).animate({left:"+=5px"},40)
    .animate({left:"+=5px"},40).animate({top:"+=5px"},40).animate({top:"-=10px"},40).animate({left:"-=10px"},40)
    .animate({top:"+=5px"},40).animate({left:"+=5px"},40)
    setTimeout(function(){
        $("#info").effect("highlight", {}, 3000);
    }, 1000);

}

I want the div to be highlighted after the animate, but now I think the set of the highlight effect is not right.


Solution

  • function nudge(){
    $("#info").animate({left:"+=5px"},40).animate({top:"+=5px"},40).animate({top:"-=10px"},40).animate({left:"-=10px"},40)
        .animate({top:"+=5px"},40).animate({left:"+=5px"},40)
        .animate({left:"+=5px"},40).animate({top:"+=5px"},40).animate({top:"-=10px"},40).animate({left:"-=10px"},40)
        .animate({top:"+=5px"},40).animate({left:"+=5px"},40)
            .delay(1000) // same as setTimeout 1000
            .animate({top:"+=5px"}, 0, function(){ // dummy animate for callback
                $("#info").effect("highlight", {}, 3000);
            });
    }