延遲滾動到錨鏈接

Question

我對JS很糟糕，甚至可能在解釋我在做什麼時更糟糕，請耐心等待。我有一個外部腳本，可以平滑滾動到錨鏈接的過渡。我想在一個元素上延遲滾動。

外部腳本：

$(function() { 

     function filterPath(string) { 
      return string 
      .replace(/^\//,'') 
      .replace(/(index|default).[a-zA-Z]{3,4}$/,'') 
      .replace(/\/$/,''); 
     } 

     var locationPath = filterPath(location.pathname); 
     var scrollElem = scrollableElement('html', 'body'); 
       $('a[href*=#]').each(function() { 
       var thisPath = filterPath(this.pathname) || locationPath; 
       if ( locationPath == thisPath && (location.hostname == this.hostname || !this.hostname) && this.hash.replace(/#/,'')) { 
       var $target = $(this.hash), target = this.hash; 
       if (target) { 
       var targetOffset = $target.offset().top; 
       $(this).click(function(event) { 
       event.preventDefault(); 
       $(scrollElem).animate({scrollTop: targetOffset}, 2600, function() { 

       location.hash = target; 
      });});}}}); 

       function scrollableElement(els) { 
      for (var i = 0, argLength = arguments.length; i <argLength; i++) { 
       var el = arguments[i], 
       $scrollElement = $(el); 
       if ($scrollElement.scrollTop()> 0) { 
        return el; 
       } else { 
        $scrollElement.scrollTop(1); 
        var isScrollable = $scrollElement.scrollTop()> 0; 
        $scrollElement.scrollTop(0); 
        if (isScrollable) { 
         return el; 
        }}}return [];}}); 

它嵌入在主PHP文件，像這樣：

<script src="smoothScroll.js"></script> 

所以這是完全錯誤的，但我想基本上是做什麼：

<a href="#whatwedo" onClick="setTimeout(smoothScroll.js, 5000)"> 

延遲這個元素的滾動的最佳方式是什麼？

Answer 1

我想你可以靜態匹配href中一個特定的錨值，即使它是馬虎。

https://jsfiddle.net/cpcnsd0v/

var delay; 

$('a').click(function(e) { 
    e.preventDefault(); 
    delay = 0; 

    if ($(this).attr('href').split('#')[1] === 'whatwedo') { 
     delay = 1000; 
    } 

    setTimeout(function() { 
     // do scroll here 
    },delay); 
});