平滑锚定滚动到特定URL

Question

我设法将光滑的锚点滚动包含到我的页面中。然而，它与我在页面上也有的rootwizard崩溃了。所以这是一个问题：如何将平滑的锚点滚动添加到一个特定的URL？

HTML：

<a class="scroll" href="#trinnfortrinn"><div class="kvit handlingsdriver grow">Link
</div></a>

我试过的一个光滑锚点滚动的示例：

$(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

我试图在Stackoverflow和Google上查找它，但我找不到任何答案。你能帮帮我吗？

Rootwizard（如果需要）

<div class="container rootwizard">
        <div id="rootwizard">
            <div class="navbar">
              <div class="navbar-inner">
                <div class="container">
                    <ul>
                        <li><a href="#tab1" data-toggle="tab">1</a></li>
                        <li><a href="#tab2" data-toggle="tab">2</a></li>
                        <li><a href="#tab3" data-toggle="tab">3</a></li>
                        <li><a href="#tab4" data-toggle="tab">4</a></li>
                    </ul>
                </div>
              </div>
            </div>
            <div id="bar" class="progress progress-striped active">
                <div class="bar"></div>
                </div>
            <div class="tab-content">
                <div class="tab-pane" id="tab1">
                     [...]
                </div>
                <div class="tab-pane" id="tab2">
                     [...]
                </div>
                <div class="tab-pane" id="tab3">
                     [...]
                </div>
                <div class="tab-pane" id="tab4">
                     [...]
                </div>                   
            </div>  
        </div>
    </div>