Question

我知道这个主题已遍布此网站，但我找不到任何针对我的问题的具体内容。

问题是我想慢慢滚动到div。它工作正常，直到第二次单击，或在页面中的任何位置滚动，除了在顶部。单击导航时，我需要指定的div元素位于屏幕的最顶部。我的jQuery行：

$("#vitals").click(function(){
    $(".parallax").animate({
        scrollTop: $("#toVitals").offset().top},
        'slow');
});

$("#andrejs").click(function(){
    $(".parallax").animate({
        scrollTop: $("#toAndrejs").offset().top},
        'slow');
});

我的导航栏：

<nav>
            <ul>
                <li id="firstLiElement" class="main-nav ieraksti"><a href="prew2.html">ieraksti!</a></li>
                <ul id="audio_sub_menu">
                    <li id="vitals"><a href="prew2.html#toAudio">audio</a></li>
                    <li id="andrejs"><a href="prew2.html#toVideo">video</a></li>
                </ul>
                <li class="main-nav" id="audio"><a href="prew3.html">paklausies!</a></li>
                <li class="main-nav" id="video"><a href="prew4.html">paskaties!</a></li>
                <li class="main-nav"><a href="prew8.html">latvian voice-overs</a></li>
                <li class="main-nav" id="kontakti"><a href="prew5.html">pasūti!</a></li>
                <li class="sejputns"><a href="https://www.facebook.com/pages/Ierakstilv/1631345117081018" target="_blank"><img src="sejbuksis.png"></a></li>
            </ul>
        </nav>

这些div位于带有＆＃34; parallax＆＃34;的div中，如果我使用的话，它们根本不滚动

$('html, body').animate...

我的页面结构是：

<html>
<head>
</head>

<body>
    <div id="navigation" style="margin-top: -20px;">
        <div id="logo" style="margin-top: 15px;"></div>
            <nav></nav>     
        </div>

        <div class="parallax">
            <div id="firstBack" class="parallax__layer parallax__layer--back"></div>
            <div id="secondBack" class="parallax__layer parallax__layer--back" style="margin-top: 145.08px; z-index: 1;"></div>
            <div id="thirdBack" class="parallax__layer parallax__layer--back" style="margin-top: 604.5px; z-index: -1;"></div>
            <div id="overBox" style="margin-top: 100.75px;"></div>
            <div id="info" class="parallax__layer--base" style="margin-top: 241.8px;"></div>
            <div id="info2" class="parallax__layer--base" style="margin-top: 290.16px;"></div>
            <div id="info3" class="parallax__layer--base" style="margin-top: 322.4px;"></div>
            <div id="footer"></div>
        </div>
    </div>
</body>
</html>

并且所需的div位于info2处，一处位于info3 div处。那么我会点击<li id="vitals">audio</li>然后它会转到正确的位置，但前提是我位于页面顶部。如果我再次点击，它会滚动到顶部。最糟糕的是，如果我点击第一个然后第二个，它甚至找不到第二个div。有什么想法吗？我对任何事情都持开放态度。

jQuery滚动并不像假设的那样

0 个答案: