引导滚动间谍偏移高度在火狐中不起作用

bootstrap scrollspy offset Height not working in firefox

本文关键字：火狐 不起作用 高度 滚动 间谍      更新时间：2023-09-26

我使用此脚本在我的引导主题中用于滚动间谍偏移高度。此代码在 Firefox 中无法正常工作，并且偏移量运行，这适用于 chrome。

var offsetHeight = 120;
    $("#p-menu a[href^='#']").on('click', function(e) {
   // prevent default anchor click behavior
   e.preventDefault();
   // store hash
   var hash = this.hash;
   // animate
   $('html, body').animate({
       scrollTop: $(this.hash).offset().top-offsetHeight}, 300, function(){
       // when done, add hash to url
       // (default click behaviour)
       window.location.hash = hash;
     });
    });

.HTML：

<ul class="nav nav-tabs bg" role="tablist" id="p-menu">
      <div class="container">
        <a href="#info" data-scroll="#info" class="product-scrollspy active"><i id="info-icon"></i><span>Informations</span></a>
        <a href="#details" data-scroll="#details" class="product-scrollspy "><i id="details-icon"></i><span>Specifications</span></a>
        <a href="#comments" data-scroll="#comments" class="product-scrollspy "><i id="comments-icon"></i><span>Comments</span></a>
        <a href="#diagram" data-scroll="#diagram" class="product-scrollspy "><i id="diagram-icon"></i><span>Diagram</span></a>
      </div>
    </ul>
    <div class="row bg" id="info" data-spy="scroll" data-target=".navbar-example">
        <div class="p_info" id="details">
          ...
        </div>
        <div class="p_info" id="comments">
          ...
        </div>
        <div class="p_info" id="diagram">
          ...
        </div>       
    </div>

我遇到了同样的问题并用这个解决了它

history.pushState(null, null, myHash);

而不是

window.location.hash = myHash;
相关文章：