Question

当我将名为smoothScroll.js的以下脚本包含在我的网页中时：

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

平滑滚动是我页面上唯一可行的工作，我的所有链接都断了，我的联系模式也没有显示，即使我的引导程序图像滑块不再起作用。有人可以帮助我。

此按钮/链接：

    <div class="learnMore">
      <ul id="insidepagenav">
        <li><a href="#about" class="btn btn-default">Learn More</a></li>
      </ul>

应该平滑滚动到此部分：

    <section id="about">

    </section>

Answer 1

这是因为例如轮播与href=#carousel-example-generic有链接，当您点击轮播箭头或分页时，您将执行平滑滚动脚本而不是Bootstrap轮播。

您可以将点击事件更改为以下内容：

$('a[smooth-scroll]').click(function() {
  // Content
});

并将此属性添加到您的链接：

<a href="#about" class="btn btn-default" smooth-scroll>

Bootstrap平滑滚动脚本打破了页面上的所有其他内容

1 个答案: