我发现我的问题解决方案:
截至目前我还没有使用yii2导航栏代替已经使用的HTML。当我使用yii2导航栏时,我不必调用任何javascript。
菜单栏这是我的看法页:查看/顶部菜单/ chemicalinventory.php
<?php echo yii\bootstrap\Nav::widget([
'items' => [
['label' => Yii::t('app','Inventory'),'url' => ['/product/index']],
['label' => Yii::t('app','Requests'),'url' => ['/product-requests/index']],
['label' => Yii::t('app','Deleted'),'url' => ['/productlines-deleted/index']],
],
'options' => ['class' =>'nav nav-tabs nav-tab nav-text navbark'],
]);
?>
现在我可以在我的任何视图页呈现此。
<?php echo \Yii::$app->view->renderFile('@app/views/topmenu/chemicalinventory.php'); ?>
我的顶部菜单的CSS是
.nav-tab-pills { border-bottom: 3px solid #DDD; }
.nav-tab-pills > li.active > a, .nav-tab > li.active > a:focus, .nav-tab-pills > li.active > a:hover { border-width: 0;background-color:#F7F7F7; }
.nav-tab-pills > li > a { border: none; color: gray; }
.nav-tab-pills > li.active > a, .nav-tab-pills > li > a:hover { border: none; color: #1ABB9C !important; background: transparent; }
.nav-tab-pills > li > a::after { content: ""; background: #2A3F54; height: 3px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s ; transform: scale(0); }
.nav-tab-pills > li.active > a::after, .nav-tab-pills > li:hover > a::after {transform: scale(1); }
.tab-nav-pills > li > a::after { background: #21527d none repeat scroll 0% 0%;}
.tab-pane { padding: 15px 0; }
.tab-content{padding:20px}
.nav-text{font-weight: bold}
.nav-text{font-size: 15px;}
这会给输出的东西像下面的图片:
你能举一个例子,说明你的网址看起来像什么时候工作,什么时候中断?很可能你需要做一些分裂。 –