我在网站上有一个多步骤的Web表单。当用户点击下一步时,div one淡出,div two淡入。我看到的问题是,当div one淡出时,div two会在div one下面淡入,然后一旦div one淡出,就会跳动。
我该如何防止这种情况发生,让它们真正地交叉淡入淡出?
HTML
<div class="step-1">
<!-- CODE -->
</div >
<div class="step-2">
<!-- THIS DIV IS HIDDEN TO BEGIN WITH -->
</div >
JS
$( ".step-1-next" ).on( "click", function() {
$( ".step-1" ).fadeOut( "slow" );
$( ".step-2" ).fadeIn( "slow" );
return false;
});