淡入淡出的div然後滑過延遲

我目前有一個div在淡入淡出之後延遲播放。我需要淡化和幻燈片在延遲後同時發生。有誰知道這是否可能？這是我目前有：淡入淡出的div然後滑過延遲

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#image1').hide(); 
    $('#image1').delay(2500).fadeIn('3000'); 
    $('#image1').animate({'margin-top': '150px'}, 1000); 
}); 
</script>

來源

2013-03-19 dave

看到這個：

$(document).ready(function(){ 
    $('#image1').hide().delay(2500).queue(function(next) { 
     $(this).fadeIn({duration:3000, queue:false}).animate({'margin-top': '150px'}, {duration:3000, queue:false}); 
    }); 
});

Sample

或者更好的動畫不透明度;

$(document).ready(function(){ 
    $('#image1').hide().delay(2500).animate({marginTop: '150px', opacity: 1}, 1000); 
});

來源

2013-03-19 16:05:43 Anujith

這看起來正是我所需要的（第一個例子），但延遲不起作用！ – dave 2013-03-19 17:14:06

@dave：我更新了我的第一個答案和小提琴。 – Anujith 2013-03-19 18:36:56

Hi @ A.V。 - 謝謝 - 完美的作品。只是想弄清楚你改變了什麼，這樣我可以更好地理解。非常感謝。 – dave 2013-03-20 09:23:37

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#image1').hide(); 
     $('#image1').delay(2500).animate({marginTop: '150px', opacity: 1}, 1000); 
    }); 
</script>

來源

2013-03-19 16:05:35 gpasci

非常感謝，但是在本例中，不透明度和滑動操作不會同時發生。 – dave 2013-03-19 17:13:10

fadeIn()基本上動畫化從0到1的不透明性，所以才這樣做，在你的animate()功能，或者使用queue()功能進行自定義動畫隊列：

$(document).ready(function(){ 
    $('#image1').hide() 
       .delay(2500) 
       .animate({ 
         opacity : 1, 
         marginTop: '150px' 
       }, 1000); 
});

來源

2013-03-19 16:05:50 adeneo

謝謝，這與我所需要的接近，但動畫和不透明度的變化仍然不會同時發生。 – dave 2013-03-19 17:11:46

如果使用slideDown你不不需要撥打fadeIn。因此，如何：

$(document).ready(function(){ 
    $('#image1').hide(); // If you start off with CSS hidden styles, this is not needed. 
    $('#image1').delay(2500).slideDown(3000); 
});

注意，也如果您在樣式表設置適當的利潤不需要animate電話。

來源

2013-03-19 16:20:47 guillobuteler

淡入淡出的div然後滑過延遲

回答

相關問題