2010-08-31 108 views
1

嘿,我有一个div通过jquery动画移动,我试图计算divs的位置。位置是通过点击来计算的,但是之后是动画计算之前的位置,而不是动画之后。jquery计算动画后div的位置

Sooo基本上我将如何去动画发生,然后有位置计算,并使隐藏适当的按钮?

这是我到目前为止的一个例子。实际上,除了在动画完成之前计算var galleryItemLeft之外。 http://www.ehbeat.com/test/

<script type="text/javascript"> 
$(document).ready(function(){ 

//Check width of Gallery div 
var galleryWidth = $("#Gallery").innerWidth(); 

//Check width of GalleryItem 
var galleryItemWidth = $(".GalleryItem").innerWidth(); 

    $('.MoveRight').hide(); 

    $(".MoveRight").click(function(){ 
    $(".GalleryItem").animate({"left": "+=100px"}, "slow"); 
    $(".GalleryItem2").animate({"left": "+=140px"}, "slow"); 
}); 

$(".MoveLeft").click(function(){ 
    $(".GalleryItem").animate({"left": "-=100px"}, "slow"); 
    $(".GalleryItem2").animate({"left": "-=140px"}, "slow"); 
}); 

$(".Controls").live("click", function() { 
    position = $(".GalleryItem").position(); 
    galleryItemLeft = position.left; 

    if(galleryItemLeft >= "0") { 
     $('.MoveRight').hide();} 
    else{ 
     $('.MoveRight').show(); 
    } 

    if(galleryItemLeft <= galleryWidth - galleryItemWidth) { 
     $('.MoveLeft').hide();} 
     else{ 
     $('.MoveLeft').show(); 
    } 
}); 

}); 
</script> 

回答

3

.animate()可以让你有一个回调函数,一旦动画完成。

例如。

$('#clickme').click(function() { 
    $('#book').animate({ 
    opacity: 0.25, 
    left: '+=50', 
    height: 'toggle' 
    }, 5000, function() { 
    // Animation complete. do stuff here 
    }); 
}); 

找到一个div的位置,只是做:

var leftPos = $('#mydiv').css('left'); 
+0

感谢我给它一个尝试,但它的STIL hidding和显示按钮点击它彪之后。你能否看看并告诉我我做错了什么? http://www.ehbeat.com/test/ – salmon 2010-08-31 08:38:56

+0

没关系我有它排序= D非常感谢您的帮助! – salmon 2010-08-31 08:57:14