0

是否可以延迟默认操作？

我有这个链接，点击它后，我会显示一个包含内容的隐藏 div。然后我想用我的屏幕向下滑动到那个 div，所以新的 div 在我的屏幕顶部，但我的问题是，在我点击按钮后，div 需要一些时间才能动画出来，因此我需要某种延迟，因此在 div 变得可见后，scrollto 将触发。

我做了一个小提琴

HTML

<div class="wrapper">
    <div class="first-div">
        <a href="#">Link1</a>
        <a id="activate-two" href="#second">Link2</a>
        <a href="#">Link3</a>
    </div>
    <div class="second-div" id="second">
        <a id="activate-three" href="#third">Link1</a>
        <a href="#">Link2</a>
        <a href="#">Link3</a>
    </div>
    <div class="third-div" id="third">
        <a href="#">Link1</a>
        <a href="#">Link2</a>
        <a id="activate-four" href="#">Link3</a>
    </div>
</div>

CSS

.wrapper {background-color:#F60;}
.first-div {background-color:#CCC;}
.first-div, .second-div, .third-div {height:1200px;}
.second-div, .third-div {display:none;}

查询

$(document).ready(
    function(){
        $("#activate-two").click(function(){
            $("#second").animate({
            height:'show'
            });
        });
        });
4

3 回答 3

1

你不需要延迟，你需要利用.animate回调函数：

$("#activate-two").click(function(){
    $("#second").animate({
        height:'show'
    }, function() {
        //Fire your scroll function here!
    });
于 2013-07-09T15:04:58.543 回答
1

不要使用延迟，这样 - 使用回调。

jQuery 动画有一个完整的函数，当你的动画完成时会触发。然后您可以滚动到最终位置的对象。

于 2013-07-09T15:05:24.773 回答
0

也许这会帮助你：

$("#activate-two").click(function(){
   $("#second").show("100",function(){
      $('html, body').animate({ scrollTop: $("#second").offset().top }, 'slow');
   })
});

这是一个更新的小提琴

于 2013-07-09T15:11:04.293 回答