javascript - 在多个页面上平滑滚动导航

Question

我有一个单页样式页面，其中顶部导航链接到同一页面内的锚点，具有平滑的滚动效果。

问题是在其他内部页面中使用了相同的导航片段，所以我想知道：

如果当前页面不是一页机，如何创建转到一页机的条件。

这是我到目前为止所拥有的，也许阅读代码可以更容易地理解我想要实现的目标。

<ul id="main_menu">
<li><a href="#start">Start</a></li>
<li><a href="#overview">Overview</a></li>
<li><a href="#gift">Make a Gift</a></li>
<li><a href="#activities">Activities</a></li>
<li><a href="#resources">Resources</a></li>
</ul>

这在我的主页 sample.com/start 中运行良好

但是，如果我在 sample.com/overview 中，当我单击主菜单链接上的“资源”时，我应该返回到 sample.com/start#resources 而不是 sample.com/overview#resources

有任何想法吗？

score 0 · Accepted Answer

在您的起始页上按原样使用您的代码，在其他页面上将其start#resources放入您的 URL 而不是#resources唯一的。

score 0 · Accepted Answer

    <li><a href="
                <?php if(!strpos($_SERVER['SCRIPT_NAME'], 'start.php')): ?>
                    start.php
                <?php endif;?>
                #start">Start</a>
    </li>
    <li><a href="
                <?php if(!strpos($_SERVER['SCRIPT_NAME'], 'start.php')): ?>
                    start.php
                <?php endif;?>
                #overview">Overview</a>
    </li>

    <!-- etc.. -->

这将检查当前页面是否为start.php：如果是，则不执行任何操作；如果不是，start.php请href在#anchor.

我这样缩进是为了更容易阅读和理解发生了什么，但实际上你会想去掉属性内的缩进，因为空格会用大量的shref弄乱生成的 url 。%20

javascript - 在多个页面上平滑滚动导航

2 回答 2

Related

Reference