javascript - 按钮的 Scrollspy 偏移量

标签 javascript jquery html css twitter-bootstrap

我有一个固定的导航栏,所以当点击导航栏中的某个元素时我需要一点偏移,为此我使用了这段代码(它对导航栏元素非常有效):

    var offset = 68;

    $('.navbar li a').click(function(event) {
    event.preventDefault();
    $($(this).attr('href'))[0].scrollIntoView();
    scrollBy(0, -offset);
    });  

但我有两个按钮,它们也链接到网站的某些部分:

<div id="main">
    <a href="denea.com"><img src="images/face.png" class="logo"></a>

    <div id="promo">
        <h2> So, your website doesn't look good anymore? <br><h3> We'll give it a second breath, then support you along the way.</h3></h2>
    </div>

    <div id="buttons">
        <a href="#portfolio"><button id="portbut">
         View portfolio
        </button></a>

        <a href="#contact"><button id="quotebut">
         Get a quote
        </button></a>
    </div>

</div>

但是当我将他们的 id 放在我上面提到的 js 代码中时,它不起作用,在“移动”到网站的某个部分时不考虑偏移量。

我应该编辑什么以便将偏移量考虑到那些两个按钮

最佳答案

如果有人需要它,答案是:

var offset = 68;

    $('#buttons a').click(function(event) {
    event.preventDefault();
    $($(this).attr('href'))[0].scrollIntoView();
    scrollBy(0, -offset);
    });  

关于javascript - 按钮的 Scrollspy 偏移量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35108789/

相关文章:

javascript - 无法在 JavaScript 中设置 cookie

javascript - 使用 jQuery 进行多级 JSON

html - Bootstrap 菜单列表项下拉列表不是按钮

javascript - Next.js 未处理的运行时错误 "Failed to load script:/_next/static/chunks/..."仅在开发模式下触发

javascript - D3 : How to conditionally bind SVG objects to data?

javascript - 内联 SVG 和 jQuery 选择

jQuery:触发(mousemove 或 "keypressed")

javascript - cgi的start_html()方法可以有多个-script属性吗?

javascript - XPage:获取 - this._partialRefresh AJAX 调用的内容?

java - 构建 Json 对象,然后将结果与 HTML 表数据关联