Question

我的数据 - menuanchor在较小的屏幕上有一些问题。当我在桌面视图上时，我的锚点工作正常，但是当我缩小窗口大小并转到responsiveWidth时，我的链接开始变得混乱。例如，当我点击4时，窗口变为4，然后我点击2，窗口变为2但是当我从那里点击3时，它会一直向上滚动直到我的第一页的一半左右。但是，如果我例如点击导航栏中的最后一页，然后点击3，则转到第3页。它有点取决于女巫的顺序，我点击每个按钮它的工作原理。

前一段时间我没有遇到这个问题，但后来我做了一些改动，现在我不记得那是什么了。我的猜测是它与元素的位置有关，但我不确定。我知道可能很难确切地指出出现了什么问题，但我会很感激这里有什么问题或者如何找到它。

修改经过进一步调查后，我的网页似乎没有覆盖整个窗口（因为它应该），因为section fp-auto-height和mycontainer锚点显示窗口底部或顶部的页面。因此，当我从下往上滚动时，我的页面/部分锚定在屏幕顶部，但它们仍然可以锚定在屏幕的底部。所以问题可能是我不能让页面总是滚动到我的部分的顶部而不是介于两者之间的某个地方。

编辑2 有些图片可能会更清晰。

应该如何：

如何：

<body>
<nav class="navbar navbar-default">
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-container">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbar-container">
        <ul id="menu">
            <li data-menuanchor="firstPage"><a href="#firstPage" title="knapp" id="logo">asdasd</a></li>
        <li data-menuanchor="secondPage" id="2"><a href="#secondPage">2/a></li>
        <li data-menuanchor="thirdPage" id="3"><a href="#thirdPage">3</a></li>
            <li data-menuanchor="4thpage" id="4"><a href="#4thpage">4</a></li>
            <li data-menuanchor="5thpage" id="5"><a href="#5thpage">5</a></li>
            <li data-menuanchor="lastPage" id="5"><a href="#lastPage">5</a></li>
        </ul>
    </div>
</nav>
<div id="fullpage">
    <div class="section" data-menuanchor="firstPage">
        <div id="main" class="mainfront">
            <div class="row">
                <div class="midmain">
                    <div class="col-sm-5"></div>
                    <div class="col-sm-4">
                        <h1>Kqweqweqwe</h1>
                        <p>qwe qwe qwe qweqw eqwe qwe qwe qwe qwe qwe qwe qwe qweqw eqwe qw eqw eqw eqwwe</p>
                    </div>
                    <div class="col-sm-3"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="section fp-auto-height" data-menuanchor="secondPage">
        <div id="main" class="mainfilo">
            <div class="mycontainer">
                <div id="myheader"></div>
                <div class="row">
                    <div id="head-text">   
                            <h3>2</h3>
                    </div>
                </div>
                <div class="row">
                    <div id="mid-text" class="dark-text">
                        <div class="col-md-3 col-md-push-6">
                            <p>w qweqwe qwe qeq we qweqw eqw qwe qwe qwe qweq weq</p>
                        </div>
                        <div class="col-md-6 col-md-pull-3">
                            <div id="bild" class="bildfilo"></div>
                        </div>
                        <div class="col-md-4"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

部分自动高度滚动问题（整页）

0 个答案: