javascript - 使用 jquery 和 waypoints 插件一一淡入 DIV

Question

使用航点插件和 jquery，我想延迟显示 3 个 DIV（.circle-1、.circle-2、.circle-3）。触发点将是一旦 .wrapcircles 在视口中（浏览器的可见部分）。不幸的是，这不起作用。不确定这是语法错误还是其他...感谢您的帮助

 <script type="text/javascript">
$(function() {
       $('.wrapcircles').waypoint(function() {
         $(".circle-1").fadeIn('slow').delay(500);
         $(".circle-2").fadeIn('slow').delay(4000);
         $(".circle-3").fadeIn('slow').delay(8000);
         }, {
           offset: '100%'
         });
    });
</script>

Answer 1

你只需要在fadeIn() 之前应用delay()。

$(".circle-1").delay(500).fadeIn('slow');
$(".circle-2").delay(4000).fadeIn('slow');
$(".circle-3").delay(8000).fadeIn('slow');

试试这个http://jsfiddle.net/k85rz/