0

.activeサイト ナビゲーション バーには、ユーザーが現在表示しているページを特定し、そのメニュー項目にクラスを与えるロジックがあります。

私が思いついたコードは機能しますが、あまりエレガントではありません。これをより良くする方法を考えられますか？ロジックをビューからコントローラーに移動するにはどうすればよいですか? どうすれば同じことを繰り返すのをやめることができますか?

コントローラー:

<?php

class Pages extends CI_Controller {

    public function view ($page = 'home') {

        if (!file_exists('application/views/pages/'.$page.'.php'))
            show_404();

        $data['active'] = $page;

        $this->load->view('templates/header', $data);
        $this->load->view('pages/'.$page, $data);
        $this->load->view('templates/footer', $data);

    }
}

?>

景色：

<ul class="nav">
    <li class="<?php echo($active=='home')?'active':''; ?>"><a href="./">blog</a></li>
    <li class="<?php echo($active=='about')?'active':''; ?>"><a href="about">about</a></li>
    <li class="<?php echo($active=='projects')?'active':''; ?>"><a href="projects">projects</a></li>
    <li class="<?php echo($active=='lab')?'active':''; ?>"><a href="lab">lab</a></li>
    <li class="<?php echo($active=='contact')?'active':''; ?>"><a href="contact">contact</a></li>
</ul>
4

2 に答える 2

1

多分もっとエレガント？

    function is_active($item) {
        return strpos(uri_string(), $item)!==FALSE ? 'active':'';
    }


    <li class="<?=is_active('blog')?>"><a href="./">blog</a></li>

この方法は、URIの複雑さに依存します。

于 2012-09-03T05:25:12.940 に答える
1

CSSで試すことができます。たとえば、「about」ページを表示している場合、body タグは になります<body id="about">。あなたのCSS:

#about .nav li.about, #contact .nav li.contact, /* etc */ { color: red; }

これは、各 .nav li に関連するクラス名 (この場合は「about」) があることを意味します。CSS ファイルにはいくつかの繰り返しがあります (ただし、プロパティ宣言の前にすべての li クラス名をコンマで区切るだけの問題です) が、ビューはきれいに保たれます。

于 2012-09-03T14:19:26.833 に答える