Question

我有一个功能链接消除某个div并打开另一个div。我还想将scrollTop的功能添加到顶部，但它没有响应...我认为代码是完美的但也许我错过了一些东西......

JQUERY：

   // Effect to scroll top NOT WORKING
   $('.bio').click(function(){
        $('html, body').animate({scrollTop : 0},800);
        return false;
    });

    /* Open and closing feature on the about/faq */

    //When button is clicked
    $('.text-btn').on('click', function(e) {

      //Prevent url from changing
      e.preventDefault();

      //Find current popup based on data-popup attribute
      var thisInfo = $('.info-' + $(this).data('info'));

      //Hide all other popups
      $('.info').not(thisInfo).fadeOut(0, function(){
        thisInfo.fadeIn(400);
      });

      //Show this popup
    });

HTML：

<section class="content-block scroll-pane">
                    <article class="content-post">
                        <div class="info info-1" id="info-1">
                            <p>CEPODS creates commercial &amp; residential environments using shipping containers. Our aim is to create a community of enthusiast with each build of our unique modern designs.</p>
                            <p>CEPODS are seen as efficient and effective pod styled units, when compared to other typical commercial spaces such as brick &amp; mortar, food trucks, tent rentals or temporary (pop-up) stores.</p>
                            <p>CEPODS modern design standards are ideal for anyone interested in operating, marketing, advertising or expanding their presence by using innovative alternative commercial space with shipping containers. The ideal CEPODS clients -are small to large businesses, start-up, pop-up, 2nd store, test retail outlet, and advertising & marketing platforms. Our client base is also expanded to residential and lodging enthusiasts. Many more all welcome.</p>
                            <p>CEPODS expertise is based in architecture, engineering, design/build, real estate, marketing, retail sales and small business management. Our team of professionals shares the same common passion; produce high quality modern design builds.</p>
                            <h1>
                                <a href="#" class="text-btn bio" id="info-2-link" data-info="2">Bio<i class="icon-right-open-gal"></i></a>
                            </h1>
                        </div>

                        <div class="info info-2" id="info-2">
                            <h1>Micro Spaces LLC</h1>
                            <p>Executive Member: <a href="#"class="pop-btn pop-link" data-popup="1">TIMOTHY DUNLAP/TIAN MAO</a></p>
                            <p>Executive Member: <a href="#"class="pop-btn pop-link" data-popup="2">ANDREW HAGUE II</a></p>
                            <p>Director of Engineering: <a href="#"class="pop-btn pop-link" data-popup="3">RICK DE LA GUARDIA</a></p>
                            <p>Project Architect: <a href="#"class="pop-btn pop-link" data-popup="4">IBRAHIM GREENIDGE</a></p>
                            <h1>
                                <a href="#" class="text-btn bio" id="info-1-link" data-info="1">about<i class="icon-right-open-gal"></i></a>
                            </h1>
                        </div>
                    </article>
                </section>

Answer 1

当我运行它时，你的代码似乎运行正常。

您是否已将jQuery包含在$(document).ready()？

中

$(document).ready(function () {
    // Effect to scroll top NOT WORKING
    $('.bio').click(function () {
        $('html, body').animate({
            scrollTop: 0
        }, 800);
        return false;
    });

    /* Open and closing feature on the about/faq */

    //When button is clicked
    $('.text-btn').on('click', function (e) {

        //Prevent url from changing
        e.preventDefault();

        //Find current popup based on data-popup attribute
        var thisInfo = $('.info-' + $(this).data('info'));

        //Hide all other popups
        $('.info').not(thisInfo).fadeOut(0, function () {
            thisInfo.fadeIn(400);
        });

        //Show this popup
    });
});

否则，您的问题可能是页面上的其他位置。你的控制台是否有任何错误？

单击与其他jquery函数的链接后，scrollTop无法正常工作

1 个答案: