Twitter Bootstrap Carousel 在向左或向右滑动控件时不断向上移动答案

【问题标题】：Twitter Bootstrap Carousel keeps moving up when sliding control left or rightTwitter Bootstrap Carousel 在向左或向右滑动控件时不断向上移动
【发布时间】：2015-05-27 11:35:14
【问题描述】：

每次我使用控件向左或向右导航/滑动时，我的 bootstrap 3.3 轮播（代码直接取自 getbootstrap.com）都会不断向上移动到浏览器顶部。

因此，如果轮播位于页面中间，并且您开始手动滑动，它会向上移动整个页面，直到轮播到达浏览器顶部。

此处示例：http://crevisio.com/branding/pLXAsNJdn

我该如何纠正这个问题？

【问题讨论】：

标签： javascript jquery css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

这是导致网页向上滚动的代码：

$('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}, 800, function() { // <== DISABLE THIS AND THE NEXT 2 LINES
        location.hash = target;
      });
    });
  }
}

});

问题是——为什么要将click事件绑定到每个A元素的href属性包含#？

【讨论】：

但是我正在将图像加载到幻灯片中，并且由于它需要响应并且应该按比例缩放，因此我无法定义固定高度。所有图像都具有相同的大小，因此高度是给定的/固定的。
@rainerbrunotte 很抱歉，我无法提供更多帮助，如果没有问题的现场示例，我不难理解 - 您的问题可能有多个解决方案，但如果没有示例
我添加了上面的示例链接，谢谢！您会看到，当您在页面上一直向上滚动，然后使用轮播滑块向左向右导航时，整个轮播会向上移动，直到碰到浏览器顶部
@rainerbrunotte - 我已经更新了我的答案 - 希望对你有所帮助
太棒了！有用！这就是问题所在！好吧，我不知道为什么我将它链接到每个 A 元素，我只是在我的网站上获取另一个滚动条的代码，并没有注意它实际上也影响了其他 A 链接！哈哈！感谢那！ :)

【解决方案2】：

href="#carousel-branding-project" 在轮播的 HTML 定义中导致您的页面链接到 id="carousel-branding-project"，这是轮播的父 div。

如果您需要它作为锚点，请尝试将链接更改为 href="javascript:void(0)"

  <a class="left carousel-control" href="javascript:void(0)"role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="javascript:void(0)" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>

【讨论】：

谢谢！但是它不起作用......我直接从这里获取了原始代码：getbootstrap.com/javascript/#carousel，它没有向上移动......
它必须是您页面上的其他脚本之一。尝试使用复制问题所需的最少代码创建 JSFiddle，以便我们将其隔离。
是的，实际上是这样，我的网站另一部分的另一个 JS 脚本搞砸了，见上文！不过感谢您的帮助！