views:

26

answers:

0

Hi again.

I've got little animation in jQuery. However, I don't want to allow calling other animation, until one isn't over.

URL http://misiur.com/pasek/

HTML

<div class="tooltip act" style="display: none;" id="t_arrow_1">Position absolute GO!</div>

JS

// JavaScript Document
jQuery(document).ready(function(){
var lock = 0;
$('.arrow').mouseover(function(e){
    if(lock == 0)
    {
        $('div#t_'+this.id).show(200);
        var pos = $(this).offset();
        var l = pos.left + $(this).width();
        var t = pos.top + $(this).height();
        $('div#t_'+this.id).animate({
            left: l,
            top: t}, 400, function(){ lockh(); });
    }
});
$('.arrow').mouseout(function(){
    if(lock == 1)
    {
        $('div#t_'+this.id).delay(1000).animate({
        left: 0,
        top: 0}, 400).hide(200, function(){ lockh(); });
    }
});

function lockh()
{
    return (lock == 0) ? lock = 1 : lock = 0;
}
});

This is bad, because I can call animation only one time. If I remove lock, then animation is done twice. Anyone understand me? Thanks.