SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Evangelist
    Join Date
    Mar 2011
    Posts
    423
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Dynamic PHP Navigation Bar???

    Hi,

    I am designing at web site using PHP, a MySQL Database and CSS.

    I am considering using a CSS Drop Down Menu for the horizontal navigation. And, as far as I am aware, this can only be done using CSS (or CSS and JavaScript). Can PHP help with this??

    But, when considering the left side navigation bar I am thinking about using PHP. It would be either
    1. Static with links that underline when hovered over
    or
    2. Dynamic, whereby when clicked a submenu appears below the link that is selected.

    I am confident I could achieve 1. using PHP and MySQL. Can you confirm 2. is possible? I know 2. is possible with CSS - is it too difficult or easier when using PHP? If you could confirm whether the drop down is achievable with PHP that would be great too.

    Thank you for your help,

    Matthew.

  2. #2
    SitePoint Addict Zarin Denatrose's Avatar
    Join Date
    Jan 2009
    Location
    Surrey BC, Canada
    Posts
    309
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Both of these CAN be accomplished without any PHP at all. I'm not really sure what you mean by "Dynamic", since what you're describing is a pretty standard dropdown/flyout menu, just bound to the link's click event instead of its mouseon and mouseoff.

    These are both issues to be tackled on the user end - Problem 1 is simply a set of CSS rules that looks like this:
    Code CSS:
    nav a {text-decoration: none;}
    nav a:hover {text-decoration: underline;}

    Problem 2 is a little more in depth, and will require javascript. (I'm sure there's some new fangled way to apply CSS3 to get the job done, but let's go for the cross browser method here.)

    You will need to structure your menus consistently and logically in the HTML, and use javascript to detect when your header links are clicked, then change the state of the submenus from there.

    How to Build and Enhance a 3-Level Navigation Menu | Nettuts+

    This tutorial will get you headed in the right direction, but you will need to change the events you're binding to in the javascript section, as well as some of the CSS, as this assumes you want the menu to show on Hover.

    I hope this helps!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •