1

重複の可能性:
現在のページに基づいてリンクを強調表示するにはどうすればよいですか?

環境

クリックしたときに強調表示されたままになるように、ナビゲーションメニューで選択したリンクを取得するために何年も努力してきましたが、これに関するまともなわかりやすいチュートリアルが見つかりません。

質問

  • どうすればこれを解決できますか?
  • これにはjQueryまたはPHPが最適ですか?

コード

<ul>
    <li><a href="aboutus.php">ABOUT US</a>
        <ul>
            <li><a href="aboutus.php">Company</a></li>
            <li><a href="team.php">Team</a></li>
            <li><a href="careers.php">Careers</a></li>
        </ul>
    </li>

    <li><a href="ourwork.php">OUR WORK</a>
        <ul>
            <li><a href="ourwork.php">Portfolio</a></li>
            <li><a href="upcoming.php">Upcoming</a></li>
        </ul>
    </li>

    <li><a href="whatsnew.php">WHATS NEW</a>
        <ul>
            <li><a href="whatsnew.php">News</a></li>
            <li><a href="blog.php">Blog</a></li>
        </ul>
    </li>
</ul>
4

1 に答える 1

0

解決

クリーナーはcurrent、サーバー側でページを生成するときに、選択したリンクにクラスを追加することです。

提供されたコードによると、現在のアーキテクチャに近いこの例を見つけました。

ソース: http://www.finalwebsites.com/tutorials/css-navigation-bar.php

PHP

$items = array(
    array('link'=>'scripts.html', 'label'=>'PHP scripts'), 
    array('link'=>'tutorials.html', 'label'=>'Tutorial'), 
    array('link'=>'template.html', 'label'=>'CSS template'), 
    array('link'=>'examples.html', 'label'=>'Code examples')
);

$menu = '<ul>';

foreach ($items as $val) {
    $class = ($_SERVER['SCRIPT_NAME'] == $val['link']) ? ' class="current"' : '';
    $menu .= sprintf('<li><a href="%s">%s</a></li>', $val['link'], $val['label']);
}

$menu .= '</ul>';

echo $menu;

CSS

ul li a.current { background-color: #40611F; color: #FFFFFF; }
于 2012-07-24T20:49:25.903 に答える