Drop Down Menus with PHP/CSS

[Aaron Robinson]

I am trying to create a sidebar menu which when categories are clicked, they expand and show items under each category.

My website is structured so that an index.php is used to include 3 other php files: header, body and footer. The body is a php file that changes based on a POST/GET from the menu.

My first attempt to create the behavior I want was with jQuery and it looks quite nice except if I change the body, I effectively reload the page and lose any previously expanded menu.

I have thought about putting all my content in a single page and using CSS to hide the extra body layers but this seems like a dirty trick which will kill load times on my website.

So I am now exploring embedding PHP in CSS. My header.php uses a html link tag to include my new css/main.php which is mostly CSS with a few PHP variables for CSS attributes. But I need to change the variable in the header.php which includes my menu div. The variables do not appear to be visible to one another. I am sure that my PHP within the css/main.php is working.

I can provide any code segments in question but would rather wait till a specific thing is in question before dumping code. I am also open to a completely new method of providing these drop down menus.

I hear you. Tried the old php in css thing myself. It was interesting, but quite unnecessary. It can be useful for passing style data from one page to another inside style tags though.

Some js trees/expanders will carry the 'state' from one page to another. It seems to have magical memory, but really you can save this data to a cookie. If using ajax - you could even store it in a file/session variable or a serialized value in a db. Choice is yours.

All you need for a non-ajax version is an expand/collapse function that writes the last known expand/collapse id to a cookie. I'm assuming that you can only have one expanded section - I may be wrong. If wrong, a little more coding with allow an array to be saved instead.

When the new page loads, read the cookie and format the menu accordingly.

[Aaron Robinson]

I hear you. Tried the old php in css thing myself. It was interesting, but quite unnecessary. It can be useful for passing style data from one page to another inside style tags though.

Some js trees/expanders will carry the 'state' from one page to another. It seems to have magical memory, but really you can save this data to a cookie. If using ajax - you could even store it in a file/session variable or a serialized value in a db. Choice is yours.

All you need for a non-ajax version is an expand/collapse function that writes the last known expand/collapse id to a cookie. I'm assuming that you can only have one expanded section - I may be wrong. If wrong, a little more coding with allow an array to be saved instead.

When the new page loads, read the cookie and format the menu accordingly.

I looked at cookies but was a bit confused on how to return to a default position after returning to the website, but since this question is no longer relevant in this thread, I have created a new post in the JavaScript Forum: http://www.daniweb.com/forums/post1160840.html#post1160840

Thanks Ardav!