单击链接时更改颜色

Question

If I have a menu set up in the header which I use for most of my pages as "include/header.php" how do I setup so when I click on a link, it goes to that page, and that link changes colors (and shows as active)? Would jquery be good? or PHP?

Thanks!

Answer 1

You could use PHP to add a class to the current button by comparing it's URL, and the current page URL from $_GET . Without knowing what your URL structure is like, I can't say much more than that.

For example, using an array with button text and URLs:

$links = array('Home' => 'home', 'About' => 'about');

foreach($links as $text => $page)
{
    if($_GET['page'] == $page)
    {
        echo '<a href="/index.php?page=' . $page . ' class="current">' . $text . '</a>';
    }
    else
    {
        echo '<a href="/index.php?page=' . $page . '>' . $text . '</a>';
    }
}

This code will add a class of current to the button who's page matches the value in $_GET . This might not exactly fit your needs due to you probably having a different URL structure, among other things, but it gives a basic explanation and example of how to do this.

Answer 2

Use php, you could write a function before your include like so,

function activeLink ($page) {
    if ($page = 'home') echo ' class="active"';
    elseif ($page = 'about') echo ' class="active"';
    elseif ($page = 'posts') echo ' class="active"';
}

And in your header file,

echo '<a href="#"' . activeLink($page) . '>Home</a>
<a href="#"' . activeLink($page) . '>About</a>
<a href="#"' . activeLink($page) . '>Posts</a>';

And on your actual page;

$page = 'home';
include('header');

This will do the trick.