CODEWITHSUNDEEP
javascriptjquerycsstwitter-bootstraptwitter-bootstrap-3
rainerbrunotte
rainerbrunotte

Reputation: 907

Twitter Bootstrap Carousel keeps moving up when sliding control left or right

My bootstrap 3.3 carousel (code taken straight from getbootstrap.com) keeps moving up to the browser top everytime I navigate/slide with the controls to the left or right.

So if the carousel is in the middle of the page, and you start sliding manually, it moves the entire page up until the carousel hits the browser top.

Example here: http://crevisio.com/branding/pLXAsNJdn

How can I correct this?

Upvotes: 5

Views: 2823

Answers (2)

Alon Eitan
Alon Eitan

Reputation: 12025

This is the code that cause the web to scroll up:

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

});

The question is - why do you bind the click event to every A element with href attribute containing #?

Upvotes: 3

Mark Polivchuk
Mark Polivchuk

Reputation: 95

href="#carousel-branding-project" in your carousel's HTML definition is causing your page to be linked to id="carousel-branding-project", which is the parent div of your carousel.

If you need that to be an anchor, try changing the link to 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>

Upvotes: 0

Related Questions