頁面加載時平滑滾動問題，當ID和散列設置相同時偏移量跳躍

更新：完全像這樣：但在jQuery中...也許我應該花點時間移植它。 http://davidwalsh.name/mootools-onload-smoothscroll 頁面加載時平滑滾動問題，當ID和散列設置相同時偏移量跳躍

上下文：WordPress網站，subnav導航設置爲/ page /＃idname向下滾動頁面。

我很難找出如何讓頁面滾動到ID（帶偏移量）和設置位置而不跳躍。如果你使用散列加載頁面，我怎樣才能讓頁面從頂部向下滾動？

//SMOOTH SCROLL 
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.position().top - 60; 
     $(this).click(function(event) { 
      event.preventDefault(); 
      $(scrollElem).animate({scrollTop: targetOffset}, 400, function() { 
      location.hash = target+"-section" 
      }); 
     }); 
     } 
    } 
    }); 

    // use the first element that is "scrollable" 
    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 []; 
    }

通知偏移-60和我沒有抖動，我設置散列是從ID，這是我不希望在所有不同的...

var targetOffset = $target.position().top - 60;

location.hash = target+"-section"

我想哈希保持不變，但我這樣做，所以偏移工作。任何幫助，將不勝感激。

來源

2011-04-13 Tom

簡化你的生活：http://plugins.jquery.com/project/ScrollTo

它具有偏移能力，你只要點它在元素本身。

這看起來與您更新的MooTools的SmoothScroll參考文件非常相似。 ScrollTo正是你需要的。

來源

2011-04-13 19:34:28

頁面加載時平滑滾動問題，當ID和散列設置相同時偏移量跳躍

回答

相關問題