Search code examples
phpcsshtmlphp-include

2 Navigation bars, one include for the content area. How do I effectively change the contents of the navbar#2 and content from a link on navbar#1

I have two navbars right at the top of my page:

      <section id="topnav">
            <ul>
                <li><a href="#">Links formatted like this</a></li>
            </ul>
        </section>
        <section id="bottomnav">
            <ul>
                <li><a href="#">Link</a></li>
            </ul>
        </section>

The 'bottomnav' will be unpopulated until a link on the 'topnav' is clicked. I want the 'bottomnav' to be a type of submenu I guess for the 'topnav'. For example on the 'topnav' there might be "Posts, Pages, Settings" and if you click Posts it will change the content frame to the Manage posts page, and change the 'bottomnav' to show "Manage Posts, Create New, Backup Posts" links etc. I hope this makes sense, I seem to have a disorder for explaining things badly.

I can't think of an easy way to do this at all. I will be using PHP once the templating is done btw. This was not an easy question to think of Tags for.

Thanks in advance

Solution

  • Your question is tagged with the right thing - PHP includes! That's probably the simplest way to do it. Just have different nav files for the bottom nav and include the one that is relevant.

    However, if I were you, I'd load all of them and use JS to mask all but the one that is currently active. This will save you on bandwidth by having to transfer all the content only once as opposed to five page loads.