时间戳

首页 > 解决方案 > Animate() 滚动不允许看到标题

javascript - Animate() 滚动不允许看到标题

问题描述

我让菜单变得粘稠，但我现在遇到的问题是菜单不允许我看到类别的标题.. 你可以在这里看到

http://jisparking.cl

我想知道如何将滚动动画移动到顶部以避免菜单超出类别标题..

我的代码是这样的：

  $(".nav li 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
              }, 800, function(){

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

谢谢！

标签： javascriptjquery

解决方案

您可以简单地从中减去一个值scrollTop: $(hash).offset().top，例如scrollTop: $(hash).offset().top - 50

当然，这会破坏第一个链接，因为它会给出负值。一个可能的解决方案是

scrollTop: Math.max($(hash).offset().top - 50, 0)

（如果值为负Math.max将返回0）

这是为了尽可能少地更改您的代码，但我认为可能还有其他方法可以实现您想要的。

推荐阅读