2013-03-05 105 views
2

我正在爲我的sme開發一個站點。我爲一頁網站使用了平滑滾動腳本的引導程序。平滑滾動和引導標籤衝突

問題是,我需要一個帶有單個服務信息的選項卡窗格,但這與平滑滾動腳本相沖突,這意味着當我單擊某個選項卡時瀏覽器會出現干擾。當我禁用smoothscroll腳本時,標籤工作得很好。有什麼辦法可以讓我有兩種功能?

的平滑滾動腳本現在用現在的問題是這...從CSS-tricks.com

<script> 
$(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'); 

    // Any links with hash tags in them (can't do ^= because of fully qualified URL potential) 
    $('a[href*=#]').each(function() { 

     // Ensure it's a same-page link 
     var thisPath = filterPath(this.pathname) || locationPath; 
     if ( locationPath == thisPath 
      && (location.hostname == this.hostname || !this.hostname) 
      && this.hash.replace(/#/,'')) { 

       // Ensure target exists 
       var $target = $(this.hash), target = this.hash; 
       if (target) { 

        // Find location of target 
        var targetOffset = $target.offset().top; 
        $(this).click(function(event) { 

         // Prevent jump-down 
         event.preventDefault(); 

         // Animate to target 
         $(scrollElem).animate({scrollTop: targetOffset}, 400, function() { 

          // Set hash in URL after animation successful 
          location.hash = target; 

         }); 
        }); 
       } 
     } 

    }); 

    // Use the first element that is "scrollable" (cross-browser fix?) 
    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 []; 
    } 

}); 
</script> 
+0

發佈html或測試頁以顯示wats goin on – Shail 2013-03-06 02:46:54

回答

3

採取這一行:

$('a[href*=#]:not([data-toggle="tab"])').each(function() { 

$('a[href*=#]').each(function() { 

嘗試更換

0

我使用data-toggle="pill"爲標籤菜單,所以我替換

$('a[href*=#]').each(function() { 

$('a[href*=#]:not([data-toggle="pill"])').each(function() { 

這工作正常。