jQuery的一些動畫改變其位置後獲取元素的最新頂部位置

Question

我想在jQuery中實現一個垂直的手風琴菜單，有點diffrence。 我想爲主菜單左側的箭頭和子菜單右側的箭頭設置動畫。

我可能沒有想象它，但我的問題很簡單。當點擊一個元素時，我需要獲得它的頂部位置，但是由於其子菜單正在縮小或增加，單擊元素後它的位置發生了變化。

如何在子菜單動畫並更改其位置後獲取該元素的最新位置？

您可以在下面找到該代碼。它可以解釋自己..

$("#firstpane p.menu_head").click(function(e) 
{ 
    $('#larrow').hide(); 
    $(this).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow"); 
    $('#bgImageContainer').show(); 
    $('.slidesContainer').hide(); 
    $('.slidesThumbs').hide(); 

    if($(this).hasClass('subcategory')){ 
     animateLeftArrow(this); 
    } 
}); 

function animateLeftArrow(item){ 
    var pos = $('#rarrow').css('top').replace(/[^-\d\.]/g, ''); 
    var itpos = $(item).position(); 
    if($(item).hasClass("first")) 
     lastpos = itpos.top -202 + 9; 
    else 
     lastpos = itpos.top - 202; 
    $('#rarrow').show(); 
    $('#rarrow').animate({ 
     top: lastpos 
    }); 
} 

Answer 1

您將要使用動畫的回調函數。 （http://api.jquery.com/animate/）

$('#rarrow').animate(
{ 
    alert("before"); 
}, 1000, 
function() 
{ 
    alert("after"); 
}); 

Answer 2

$('#rarrow').animate(
    { top: lastpos }, 
    1000, 
    function(){ 
     console.log($(this).offset()); 
    } 
);