突出显示基于当前页面的链接(动态导航PHP)

时间:2015-08-19 17:11:14

标签: php html css3

这对某些人来说可能很容易,但我已经尝试了各种方法让它起作用但无济于事。

这是一个简短的内容;

我有一个页面,我在此页面中有链接,当点击加载其他页面但显示在同一页面时。

    <section class="posts-header">
    <div class="col span-3-of-3">
    <ul class="posts-nav" id="navigation">
    <li><a href="blog_admin_posts.php?source=view_all_posts">View Posts</a></li>
    <li><a href="blog_admin_posts.php?source=view_posts">View Posts</a></li>
    <li><a href="blog_admin_posts.php?source=add_posts">Create Post</a></li>
    </ul>
    </div>
    </section>

上面的代码显示了点击时的链接,使用$_GET将变量传递给下面的switch语句;

if(isset($_GET['source'])) {
$source = $_GET['source'];}

switch($source) {
case 'view_posts';
    include "php/blog_posts_view.php";
    break;

case 'view_all_posts';
    include "php/blog_posts_reviewer.php";
    break;

case 'add_posts';
    include "php/blog_posts_addform.php";
    break;

case 'edit_posts';
    include "php/blog_posts_editform.php";
    break;

default:
    include "php/blog_posts_view.php";
    break;}

如何突出显示当前页面?使用html,js,css3或全部。 感谢。

3 个答案:

答案 0 :(得分:0)

您可以在CSS中定义一个active类,它描述了活动链接的样式。例如,一种非常简单的风格:

.active {
    color: red;
}

然后你必须修改你的菜单:

<section class="posts-header">
    <div class="col span-3-of-3">
        <ul class="posts-nav" id="navigation">
            <li><a href="blog_admin_posts.php?source=view_all_posts"<?=$_GET['source'] == "view_all_posts" ? " class=\"active\"" : ""; ?>>View Posts</a></li>
            <li><a href="blog_admin_posts.php?source=view_posts"<?=$_GET['source'] == "view_posts" ? " class=\"active\"" : ""; ?>>View Posts</a></li>
            <li><a href="blog_admin_posts.php?source=add_posts"<?=$_GET['source'] == "add_posts" ? " class=\"active\"" : ""; ?>>Create Post</a></li>
        </ul>
    </div>
</section>

现在,活动菜单链接文本应显示为红色。

答案 1 :(得分:0)

您可以使用以下方式获取当前页面名称:

$pageName = $_GET["source"];

然后,对于每个列表项,您可以执行以下操作:

<li class="<?= ($pageName === 'firstPageName') ? 'active' : '' ?>"><a href="...">...</a></li>

当然,您需要设置课程.active的样式,或者您希望如何命名它。

答案 2 :(得分:0)

也许您会发现这非常有用,它会将您的课程添加到当前页面,并允许通过简单地添加到数组来添加更多链接到您的页面。

<?php
    $page = isset($_GET['page']) ? $_GET['page']:  ' ';
    $pages = ['view_all_posts','view_posts','add_posts'];
    $active = '';
    if (in_array($page,$pages)){
        $active = 'active';
    }
 ?>

然后修改菜单:

<section class="posts-header">
  <div class="col span-3-of-3">
    <ul class="posts-nav" id="navigation">
    <?php foreach ($pages as $key => $value) : ?>
      <li>
        <a href="blog_admin_posts.php?source=<?=$value?>" class="<?=$active?>"><?=$value?></a>
      </li>
    <?php endforeach;?>
    </ul>
  </div>
</section>