scrollTo TweenMax不完全停止在散列

Question

我有一個插件scrollTo（tweenMax），當我點擊和菜單鏈接網站幻燈片到我在菜單上選擇的部分ID的問題。但該網站並沒有停止在該部分的開始，我需要顯示h2（標題）。

我的代碼

$(function(){ 
 
    var wrapper = $("#wrapper"), 
 
    $menu = $("#menu"); 
 

 
    $menu.on("click","li", function(){ 
 
    var $this = $(this), 
 
     href = $(this).find("a").attr("href"), 
 
     topY = $(href).offset().top; 
 

 
     TweenLite.to(window, 2, {scrollTo:{y:topY, x:0}, ease:Cubic.easeIn}); 
 

 
    return false; 
 
    }); 
 

 
});

section{ 
 
    margin-top: 200px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script> 
 
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/plugins/ScrollToPlugin.min.js"></script> 
 

 
<div class="wrap"> 
 
    <nav id="menu" class="menu"> 
 
    <ul class="row-centered"> 
 
     <li class="icon-play"><a href="#home">Home</a></li> 
 
     <li class="link-empresa"><a href="#empresa">Link 2</a></li> 
 
     <li class="link-tecnologias"><a href="#tecnologicas">Link 3</a></li> 
 
     <li class="link-cases"><a href="#cases">Link 3</a></li> 
 
     <li class="link-contato"><a href="#contato">Link 4</a></li> 
 
    </ul> 
 
    </nav> 
 
    
 
    <section id="home"><h2>Title 1</h2></section> 
 
    <section id="empresa"><h2>Title 2</h2></section> 
 
    <section id="tecnologicas"><h2>Title 3</h2></section> 
 
    <section id="cases"><h2>Title 4</h2></section> 
 
    <section id="contato"><h2>Title 5</h2></section> 
 
</div>

在上面這個例子中，它的確定。但在我的網站中，相同的代碼效果不佳。在我的網站上有一個固定在頂部的菜單，它有一個高度= 75px，我把{scrollTo:{y:topY -75, x:0}，但沒有工作。

更新1

Project

Answer 1

var extraOffset = $menu.hasClass('fixar') ? 75 : 0; 

TweenLite.to(window, 2, { scrollTo: { y: topY - extraOffset, x: 0 }, ease: Cubic.easeIn }); 

看來，問題是，當點擊事件發生時，$菜單是否被固定。當您一直滾動到頂部時，$menu不是固定的，但在向下滾動一下後，$menu就會固定。這種行爲的原因是因爲「固定」$menu從網頁的一般流程中移除，並且計算出的偏移量被丟棄。

使用我的解決方案，我創建了一個新變量extraOffset，用於檢查$menu是否已修復。如果是，則該值設置爲75，否則爲0.請告知我是否需要進一步澄清！

編輯：如果您想在網頁加載時使用#hashtag添加對平滑滾動的支持，請按照以下示例進行操作：Smooth scroll to anchor after loading new page。 注意：您可能希望始終添加額外的偏移量，因爲在滾動到內容時預計將修復$menu。