Question

我一直在尝试类似案例的解决方案，但到目前为止它们都没有奏效。

这是问题，我总共有2个html文件。在我的导航栏上，我有4个选项。其中3个引用同一页面上的id（索引），第4个引用单独的页面。现在从单独的页面回到索引，活动菜单项不是正确的“活动”菜单项。就像我点击支持页面上的“关于”一样，活动菜单项是“主页”。或者如果我点击“联系人”，活动菜单项将变为“关于”。出现的内容是正确的。但是活动菜单项不是。

这是来自index.html文件：

<div class="navbar-collapse collapse">
    <ul class="nav navbar-nav navbar-right">
        <li class="current"><a href="#home">Home</a></li>
        <li><a href="#about">About</a></li>
        <li class="support" ><a href="support.html">Support</a></li>
        <li ><a href="#contact">Contact</a></li>
</ul>
</div>

这里来自support.html：

<div class="navbar-collapse collapse">
    <ul class="nav navbar-nav navbar-right">
        <li><a href="index.html#home">Home</a></li>
        <li><a href="index.html#about">About</a></li>
        <li class="current"><a href="#support">Support</a></li>
        <li ><a href="index.html#contact">Contact</a></li>
    </ul>
</div>

这是我尝试过的解决方案之一，没有结果： https://stackoverflow.com/a/11539359

JS不是我的强项，非常感谢你的帮助！

Answer 1

例如，

加载脚本的方式存在很多问题

 $(document).ready(function() {
        $('#ind').cycle({
            fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
        });
    });

你在加载jquery之前调用它，所以它给出了 $ is undefined error ，所以解决办法是在最后移动所有脚本，并且还有一个内联脚本也用于菜单处理程序，将其移至记录就绪函数

我已将修复程序包含在以下文件HTML Zip files中，您会发现所有JS都已移至结束。它现在对我来说很好用

还有一件事使您的接触高度与其他容器相同或从医生部分删除额外的边距/填充

bootstrap navbar class =来自单独页面时的活动更改

1 个答案: