Question

HTML：

<div id="mark" class="container">
    <div class="col-xs-12">
        <img src="/images/newdesk3.jpg" width="60px">
        <span>Lorem ipsum dolor</span>  

        <div id="t3"><button class="btn btn-warning">Buy Now</button></div>
        <div id="t2"><a href="#oneeye">Technical</a></div>
        <div id="t1"><a href="#similarproducts">Product presentation</a></div>
    </div>
</div>
...
<div id="similarproducts">
...
</div>
<div id="oneeye">
...
</div>

jquery offset：

 var offset = 80;
$('#t2 a, #t1 a').click(function(event) {
    event.preventDefault();

    $($(this).attr('href'))[0].scrollIntoView();
        scrollBy(0, -offset);
});

jquery smooth animate：

$("#t2 a, #t1 a").on('click', function(event) {

    if (this.hash !== "") {

      event.preventDefault();      
      var hash = this.hash;

      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){  

        window.location.hash = hash;
      });
    }  
  });

Jquery偏移和平滑动画（滚动）正在作为代码工作，但当我把它们放在一起时不起作用。我使用带有Bootstrap v3.3.5的jquery版本1.9.1

我需要指定一个带有动画的偏移位置。组合这些代码并正常工作的正确代码jquery是什么？

Answer 1

新的jquery代码将是

$("#t2 a, #t1 a").on('click', function(event) {

    if (this.hash !== "") {

      event.preventDefault();      
      var hash = this.hash;

      $('html, body').animate({
        scrollTop: $(hash).offset().top -80
      }, 800, function(){  

        window.location.hash = hash;
      });
    }  
  });

Bootstrap scrollspy偏移和平滑动画

1 个答案: