0

这是 JSFiddle：http: //jsfiddle.net/dAQrE/

在 javascript 部分的顶部，您将看到假设#proceed在动画后向下滚动到 div 的代码：

第 1 行，第 2 行，第 3 行，第 4 行..

继续 div 页面应该滚动到：

<div id="proceed">
    <div id="if_one">   <a href="http://websitelinkhere.com/1" class="button_primary agree">If Question 1 = Answer 1</a>
    </div>
    <div id="if_two">   <a href="http://websitelinkhere.com/2" class="button_primary agree">If Question 1 = Answer 2</a>
    </div>
    <div id="if_three"> <a href="http://websitelinkhere.com/3" class="button_primary agree">If Question 1 = Answer 3</a>
    </div>
</div>

动画后应该滚动到#proceeddiv 的 javascript：

// assign the correct target
var target = $('#proceed');

$('html, body').animate({
    scrollTop: target.offset().top
}, 200);

// scroll!
$('html, body').animate({
    scrollTop: target.offset().top
}, 200, function () {
    target.css({
        'border-color': 'red'
    })
});

但是现在它在动画完成之前在#proceed div中显示内容并且它根本不会向下滚动..我该如何解决这个问题？

4

1 回答 1

1

这些函数将在您编写它们时在 document.ready 上调用。它们需要封装在一个函数中，该函数在“第 1 行，第 2 行 ...”显示后被调用。

我已经分叉了你的小提琴来做到这一点。查看我包装在一个名为 的函数中的事件，以及在显示最后一个“行 x”之后proceed()我为调用该函数所做的更改。verifyAnimation()

http://jsfiddle.net/ercFw/

于 2013-10-16T17:58:41.923 回答