Question

当我在page点击锚点（即南澳大利亚，SA用餐指南，SA风格，SA住宿指南，背包客短暂澳大利亚）时，由于粘性，该部分向上移动了一点点头。

Answer 1

您应该调整此值scrollTop: $(hash).offset().top。比如custom.js中的scrollTop: $(hash).offset().top+50;或scrollTop: $(hash).offset().top-50;。

    $(document).ready(function(){
      // Add smooth scrolling to all links
      $(".hashtag a").on('click', function(event) {

        // Make sure this.hash has a value before overriding default behavior
        if (this.hash !== "") {
          // Prevent default anchor click behavior
          event.preventDefault();

          // Store hash
          var hash = this.hash;

          // Using jQuery's animate() method to add smooth page scroll
          // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
          $('html, body').animate({
            scrollTop: $(hash).offset().top-100

            // scrollTop: $(hash).offset().top+50;
          }, 1000, function(){

            // Add hash (#) to URL when done scrolling (default click behavior)
            window.location.hash = hash;
          });
        } // End if
      });
    });

Answer 2

在页脚中添加此java脚本以添加顶部偏移量。

<script type="text/javascript">
$(document).ready(function(){
  // Add smooth scrolling to all links
  $(".hashtag a").on('click', function(event) {

    // Make sure this.hash has a value before overriding default behavior
    if (this.hash !== "") {
      // Prevent default anchor click behavior
      event.preventDefault();

         // Store hash
         var hash = this.hash;


        // Using jQuery's animate() method to add smooth page scroll
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area

        var target_offset = $(hash).offset() ? $(hash).offset().top : 0;
        //change this number to create the additional off set        
        var customoffset = 40
        $('html, body').animate({scrollTop:target_offset - customoffset}, 1000, function(){

        // Add hash (#) to URL when done scrolling (default click behavior)
        window.location.hash = hash;
      });
    } // End if
  });
});
</script>

如何使用固定导航栏控制锚位置？

2 个答案: