Question

我是新手，所以我需要你的帮助，我的标题中有一个导航菜单。当页面处于活动状态时，其选项卡会有一个名为 menu_active 的特殊ID。我在页面中包含了 header.php 以减少冗余。

这是我到目前为止所尝试的：

    <nav>
        <ul id="menu">

            <?php 
                $pages = array( 'index.php' => 'Home', 'services.php' => 'Services', 'sitemap.php' => 'Calculators', 'about.php' => 'About'
                , 'contact.php' => 'Contact' );

                foreach( $pages as $url => $title ) {
                   $li = '<li ';
                   if( $url == 'index.php' ) {
                       $li .= 'class="alpha"';
                   } else if ( $url == 'contact.php' ){
                       $li .= 'class="omega"';
                   }

                   if( $_SERVER[ 'PHP_SELF' ] == $url ) {
                       $li .= 'id="menu_active"';
                   }
                   $li .= '><a href="' . $url . '"><span><span>' . $title . '</span></span></a></li>';
                   echo $li;
                }
            ?>

        </ul>
    </nav>

更新 * CSS *

      #menu {
width:100%;
overflow:hidden;
margin-top:3px
    }
    #menu li {
float:left
    }
    #menu a {
display:block;
font-size: 18px;
font-weight:400;
color:#000;
background:url(../images/menu.gif) top repeat-x;
line-height:55px;
text-decoration:none;
  }
  #menu li span {
display:block;
background:url(../images/menu_left.gif) top left no-repeat
  }
  #menu .alpha span {
background:url(../images/left_menu.gif) top left no-repeat
  }
  #menu .alpha a:hover span, #menu .alpha#menu_active a span {
background:url(../images/left_menu_active.gif) top left no-repeat
  }
  #menu .omega span span {
background:url(../images/right_menu.gif) top right no-repeat
  }
  #menu .omega a:hover span span, #menu .omega#menu_active a span span {
background:url(../images/right_menu_active.gif) top right no-repeat
  }
  #menu li span span, #menu .alpha span span {
background:url(../images/menu_right.gif) top right no-repeat;
padding:0 60px
  }
  #menu a:hover, #menu #menu_active a {
color:#fff;
background:url(../images/menu_active.gif) top repeat-x
  }
  #menu a:hover span, #menu #menu_active a span {
background:url(../images/menu_left_active.gif) top left no-repeat
  }
  #menu a:hover span span, #menu #menu_active a span span, #menu .alpha#menu_active a span span, #menu .alpha a:hover span span {
background:url(../images/menu_right_active.gif) top right no-repeat
  }

我可以开始工作的第一个和最后一个菜单，但活跃状态仍无济于事。这里似乎有什么问题？你能帮助做到这一点的最佳做法是什么？

Answer 1

你确定吗？ $ _SERVER [ 'PHP_SELF'];足以检查网址？

我认为你必须使用它：

$query = $_SERVER['PHP_SELF'];
$path = pathinfo( $query );
$what_you_want = $path['basename'];

Source

不要使用“==”进行比较，更好地使用“===”。

我认为你必须检查class和id之间的空格。查看Firebug或Chrome开发者工具以查看生成的HTML代码是什么？

Answer 2

$_SERVER["PHP_SELF"]不仅包含正在执行的PHP文件的名称，还包含相对于文档根目录的路径（请参阅http://php.net/manual/en/reserved.variables.server.php）。

使用 basename 功能从 PHP_SELF 中提取文件名：

if(basename($_SERVER["PHP_SELF"]) == $url)
{
    $li .= 'id="menu_active"';
}

有关详细信息，请参阅http://php.net/manual/en/function.basename.php。

Answer 3

如果我认为你的意思，我只是有同样的问题。我能够解决它。

CSS navigation with PHP include

Html / css / php选择了导航

3 个答案: