Функция, начинающаяся слишком рано

Question

Я создаю контактную систему usin jQuery ajax. div формы имеет высоту, поэтому я подумал, что будет хорошо, если при нажатии на вход (OnFocus), div станет больше, и когда вы будете прокручивать вверх или вниз, div вернется к своей обычной высоте. Проблема в том, что после нажатия div становится больше, а затем сразу возвращается к его регулярной высоте. Вот мой код:

var big = false, 
    lastpalce = "", 
    position = ""; 

function contectboxreturn() { 
    if (big) { 
     $("#contact").animate({ 
      "height": "515px" 
     }, 400); 
     $("#showclosebutton").hide(fast); 
     big = false; 
    } 
} 

function contectboxresize() { 
    if (!big) { 
     big = true; 
     lastpalce = $(this).scrollTop(); 
     position = $("#contact").offset(); 
     $("html, body").animate({ 
      scrollTop: position.top + "px" 
     }, 400); 
     $("#contact").animate({ 
      "height": "100%" 
     }, 400); 
     $("#showclosebutton").show(fast); 
     $(function() { 
      $(window).scroll(function() { 
       if (position.top != $(this).scrollTop()) { 
        contectboxreturn(); 
       } 
      }); 
     }); 
    } 
} 

Answer 1

Set Big ИСТИНА как обратный вызов вашей анимации. Вот так.

$("#contact").animate({ 
    "height": "100%" 
}, 400, function(){ 
    big = true; 
}); 

updated fiddle

Answer 2

Попробуйте разместить свое мероприятие прокрутки ВНЕ вашей contectboxresize функции(), как это:

var big = false, 
lastpalce = "", 
position = ""; 


$(function() { 
    $(window).scroll(function() { 
     if (position.top != $(this).scrollTop()) { 
      contectboxreturn(); 
     } 
    }); 
}); 

function contectboxreturn() { 
    if (big) { 
     $("#contact").animate({ 
      "height": "515px" 
     }, 400); 
     $("#showclosebutton").hide(fast); 
     big = false; 
    } 
} 

function contectboxresize() { 
    if (!big) { 
     big = true; 
     lastpalce = $(this).scrollTop(); 
     position = $("#contact").offset(); 
     $("html, body").animate({ 
      scrollTop: position.top + "px" 
     }, 400); 
     $("#contact").animate({ 
      "height": "100%" 
     }, 400); 
     $("#showclosebutton").show(fast); 
    } 
}