Question

我已使用以下java脚本将代码编写到导航到特定部分：

以下锚点链接点击，它会重定向到不同页面的特定部分：

<a href="getinvolved/#voluntours" data-toggle="" data-target="" target="" class="button">Voluntours</a>
<a href="getinvolved/#dreamcourts" data-toggle="" data-target="" target="" class="button">Dreamcourts</a>

以下显示目标页面html ：

<div id="voluntours" class="volunteer-days" style="padding-top: 25px;">
    <p>some text1</p>
    <p>some text2</p>
    <p>some text3</p>
    <p>some text4</p>
    <p>some text5</p>
</div>

<div id="dreamcourts" class="volunteer-days" style="padding-top: 25px;">
    <p>some text1</p>
    <p>some text2</p>
    <p>some text3</p>
    <p>some text4</p>
    <p>some text5</p>
</div>

以下脚本将导航到目标网页：

if(window.location.href.indexOf("getinvolved")) {
    if(window.location.href.indexOf("#") > -1) {
        var id = window.location.href.substr(window.location.href.lastIndexOf("#"));
        var ofs = 0;
        if(id.indexOf("voluntour") > -1) {
            ofs = $(id).offset().top;
        } else if(id.indexOf("dreamcourts") > -1) {
            ofs = $(id).offset().top + 250;    
        } else {
            ofs = $(id).offset().top;
        }
    }
    $('body, html').animate({ scrollTop: ofs });
}

问题是它在开发人员屏幕中工作正常，但是当碎片大小改变时，偏移量变化和导航将转到错误的区域。

每次页面刷新后，偶数偏移也会不断变化。

请问您如何解决此问题？

偏移根据屏幕大小而变化

0 个答案: