我有这个CSS:
.tracklistOff{display:none;}
.tracklistOn{width:710px; float:left;}
.trackon{width:710px; float:left;}
此 HTML:
<div class="tracklistOff">
<div class="trackon">
... somethings...
</div>
</div>
现在,使用以下代码:
$('.tracklistOff').find('.trackon').clone().fadeIn(600).insertAfter('.tracklistOn');
我得到了 fadeIn()
效果(这对我来说很奇怪;trackon 没有 display:none;
属性)。
使用此代码:
$('.tracklistOff').find('.trackon').clone().insertAfter('.tracklistOn').fadeIn(600);
fadeIn()效果没有显示。为什么改变相同元素的位置 fadeIn() 有效或无效?
最佳答案
fadeIn
是 animate({ opacity: "show" })
的快捷方式。在此函数中,有一个条件来检查当前元素是否可见。如果该元素已经可见,则此函数不执行任何操作。
因此,您的代码中的问题是第一个示例 .trackon
当 fadeIn
时不可见被调用,而不是在第二个 .trackon
中当 fadeIn
时已经可见被调用,因此该函数不执行任何操作。
var working = $('.tracklistOff').find('.trackon').clone();
var notWorking = $('.tracklistOff').find('.trackon').clone().insertAfter('.tracklistOn');
console.log(working.is(':hidden')); // true
console.log(notWorking.is(':hidden')); // false
关于jquery - fadeIn() - 为什么这些组合有效/无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5754693/