强制jQuery在fadeIn()之前识别某些属性

时间:2013-01-04 01:57:48

标签: javascript jquery css fadein

我有一堆<div class="circle">...</div>我计划动画,就好像它们是粒子效果一样,在它们淡入时最终位置。

在我的javascript中,我有以下内容:

$(document).ready(function(){

allCircles = $(".circle");

for (var i = 0; i < allCircles.length; i++) {
    console.log('hello: ' + allCircles[i].offsetTop + ' , ' + allCircles[i].offsetLeft);
}

allThings = $("*");
allThings.fadeIn(2500);

for (var i = 0; i < allCircles.length; i++) {
    console.log('hello: ' + allCircles[i].offsetTop + ' , ' + allCircles[i].offsetLeft);

offsetTop和offsetLeft(在css文件中定义)是它们的最终位置。使用for循环,我注意到在fadeIn之前,offsetTop和offsetLeft属性都是零。只有在触发fadeIn事件后,css偏移属性才会生效。为什么jQuery会在动画fadeIn之前将所有内容归零?

1 个答案:

答案 0 :(得分:4)

如果你的圈子在你的CSS中被display: none消失,那么你就不会获得任何位置抵消。我建议您opacity: 0并使用.animate({opacity: 1})代替。