性能动画滚动位置引导程序

Question

你好，我在引导页面中遇到这个问题：

。。.

<a id="godown1">go!</a>

<a id="godown2">go!</a>

<a id="godown3">go!</a>

。。。。.

<div id="goit1"></div>

<div id="goit2"></div>

<div id="goit3"></div>

。。编码下一个

    <script>       
        $(document).ready(function() {
        $("#godown1").click(function() {
        $('html,body').animate({scrollTop: $("#goit1").offset().top}, 2000);
        });
        });
    </script>
    <script>       
        $(document).ready(function() {
        $("#godown2").click(function() {
        $('html,body').animate({scrollTop: $("#goit2").offset().top}, 2000);
        });
        });
    </script>
    <script>       
        $(document).ready(function() {
        $("#godown3").click(function() {
        $('html,body').animate({scrollTop: $("#goit3").offset().top}, 2000);
        });
        });
    </script>

该代码必须添加到脚本中？。事实证明，当我按下其中一个按钮时，它会以一种很好的方式自动下降。

但是，当我已经在我想要的位置，并按下另一个包含此动画的按钮时，动画会再次重复。

这使它看起来不太顺眼。

我能支持吗？谢谢大家！

Answer 1

看了link之后，我相信您想要的是只有在.blogfootspace child div's隐藏的情况下才运行动画。

您可以将代码组合为一个script和document ready函数：

试试这个：

<script>       
    $(document).ready(function() {
        $("#godown1").click(function() {
            if(!$('.bloqsfootspace div').hasClass('in'))   
                $('html,body').animate({scrollTop: $("#goit1").offset().top}, 2000);
        });
        $("#godown2").click(function() {
            if(!$('.bloqsfootspace div').hasClass('in'))
              $('html,body').animate({scrollTop: $("#goit2").offset().top}, 2000);
        });
        $("#godown3").click(function() {
            if(!$('.bloqsfootspace div').hasClass('in'))
                $('html,body').animate({scrollTop: $("#goit3").offset().top}, 2000);
        });
    });
</script>

您需要更改godown和godoit以匹配您的代码，但.bloqsfootspace应该保持不变。