Javascript-форум - jQuery. Запрет выполнения события если другое уже выполняется.

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - jQuery. Запрет выполнения события если другое уже выполняется. (https://javascript.ru/forum/dom-window/26472-jquery-zapret-vypolneniya-sobytiya-esli-drugoe-uzhe-vypolnyaetsya.html)

jQuery. Запрет выполнения события если другое уже выполняется.

В общем задание вот такое: "Используя css-спрайты и jquery (jquery.com) сделать кнопку, изменяющую фон при наведении мышкой на более светлый и при клике на более темный. После клика через 1 секунду кнопка должна начать исчезать и через еще 2 исчезнуть полностью."
На данный момент написал следующее:

<!DOCTYPE>
<html>
<head>
<title>CSS-спрайт и JQuery</title>
<meta http-equiv="Content-Type" content="text/html;">
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.megaweb').each(function(){
      
      $(this).mouseover(function(){
          $(this).css("background-position","0");
      });
      $(this).mouseout(function(){
          $(this).css("background-position","-157px");
      });
      $(this).click(function(){
          $(this).css("background-position","-314px");
	  $(this).delay(1000).animate({opacity:'0.0'},2000);
      });
});
});
</script>
</head>
<body>
Пример последовательно обработки событий<br> 
<div class="megaweb" href="">dsvsdvds</a>
</body>
</html>

Вся проблема в том что если в процессе выполнения анимации вывести курсор за пределы дива картинка передвинет положение согласно событию mouseout. Так вот как заблокировать mouseout если click уже произошло, ну или производится.

Сделать unbind событий. Или сделать переменную, которая не будет разрешать менять css.

спасибо большое. а то шарил, шарил документацию - ни че не нашел

// в самое начало вставить:
var checkPoint = true; 

// в клике добавить:
 $(this).click(function(){
                 checkPoint = false; 
	      $(this).css("background-position","-314px");
	      $(this).delay(1000).animate({opacity:'0.0'},2000);
                 checkPoint = true;
 });

// в маусоуте добавить:
 $(this).mouseout(function(){
         if(checkPoint){
          $(this).css("background-position","-157px");
         }
      });

Учту на будущее и такой вариант, но в данном случае помойму проще написать просто $(this).unbind() на click