Yii2 Menu::Widget()滚动时固定显示的实现方法咨询

你当前代码已给Menu组件添加navbar-fixed-top类，但可能因外层容器样式冲突或配置问题导致固定效果未生效，以下是具体调整建议：

1. 确保固定定位样式生效 #

Bootstrap的navbar-fixed-top默认设置position: fixed; top: 0; z-index: 1030;，若自定义样式干扰了该效果，可补充自定义CSS强制生效：

.navbar-fixed-top {
    position: fixed !important;
    top: 0;
    width: 100%;
    z-index: 999; /* 保证导航处于页面最上层 */
}

2. 调整容器结构避免冲突 #

将固定类移至外层的nav-wrapper容器，避免Menu组件内部容器与外层样式冲突：

<div class="nav-wrapper navbar-fixed-top">
    <a id="logo-container" href="#" class="brand-logo" style="margin-left:50px; margin-top:0px; margin-bottom:10px;">
        <img class="topleft" width="200px" height="50px" src='http://go2-telecom.com/resources/images/logo-nobackground-1000.png'>
    </a>
    <?php
        echo Menu::widget([
            'options' => ['id' => "nav-mobile", 'class' => 'green lighten-1 right'],
            'items' => [
                ['label' => 'Home', 'url' => ['site/index']],
                ['label' => 'About', 'url' => ['site/about']],
                ['label' => 'Services', 'url' => ['site/services']],
                ['label' => 'Careers', 'url' => ['site/careers']],
                ['label' => 'Contact', 'url' => ['site/contact']],
                ['label' => 'Resumes', 'url' => ['resume/index'], 'visible' => !Yii::$app->user->isGuest],
                ['label' => 'Login', 'url' => ['site/login'], 'visible' => Yii::$app->user->isGuest],
            ],
        ]);
    ?>
    <a href="#" data-activates="nav-mobile" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
</div>

3. 修复页面内容被遮挡问题 #

固定导航会覆盖页面顶部内容，需给页面主体添加顶部内边距，值匹配导航实际高度：

body {
    padding-top: 60px; /* 根据你的导航高度自行调整数值 */
}

4. 响应式按钮适配 #

确保移动端的折叠按钮在固定导航内始终可见，可补充样式：

.button-collapse {
    position: fixed;
    right: 15px;
    top: 10px;
    z-index: 1000;
}

内容的提问来源于stack exchange，提问作者Ken