Support for CSS Flyout Menu

[gee38l]

im having a similar issue just installed the latest version of this mod but im getting no css.

Tried to view the css in FF but it comes up with nothing. Checked the file and seems to be fine also re upoaded it and still nothing.

Any ideas?

[ckosloff]

Any ideas?

This css should be in your custom template.

[vichan]

Hi
i am new to css flyout menu.
i have tried to implement on my site http://www.etrade8888.com/.

I have followed the instruction and put each file in associate templates.

But i couldnt success to make category menu layout.
how can i make my category menu layout as css flyout menu.

[jeffiec]

This css should be in your custom template.

It is in my css dir of my template.

[ckosloff]

It is in my css dir of my template.

If the template is active, then it should be read, just like your main stylesheet.
Style will "cascade" to that stylesheet.
There is an entry in the wiki on how stylesheets cascade in zen, or maybe in the tutorials, I don't remember exactly.
Bear in mind that some settings in your main stylesheet will override the menu's stylesheet.
It's against the "cascading" logic, but ZC is not HTML but a PHP app.
Bottom line, if it reads your main CSS, and both are in same directory, it should read your menu stylesheet, otherwise your ZC is corrupt.
Make sure that the template where both are is active, you may have them together in an inactive template.

[ckosloff]

Hi
how can i make my category menu layout as css flyout menu.

If the files are in corresponding folders, you will have a flyout menu automatically, you only have to customize it.
Then turn off your original menu sidebox, look back a few posts, I already explained that.
Buy the manual and build a test site first.

[slomojojo]

I'm having issues with the plugin seeing the css, the menu is generated, but no css?
http://surferweb.com/smorgit/
thanks in advance

Be sure everything is in the correct folder.

FIRST, determine which template is currently installed. In the admin section, go to TOOLS > TEMPLATE SELECTION to see, if you're not sure. The default template for my installation was the "Classic" template.

NEXT, check the folder structure for the fly-out menu mod. There are 2 folders in the flyout menu named "YOUR_CUSTOM_TEMPLATE_NAME"; one at "includes\modules\sideboxes", and another at "includes\templates". Using the "classic" template as an example, rename both "YOUR_CUSTOM_TEMPLATE_NAME" folders to "classic".

FINALLY, go to ADMIN > TOOLS > LAYOUT BOXES CONTROLLER. If there are any error messages, click "reset" to clear those up. Then, double check that the sidebox is enabled. In my default setup using the "classic" template example, there's a entry called "sideboxes/classic/categories_css.php". Turn it on if it's off.

Hope that helps.

[Spo0f]

Get Em Fast

Thanks for all your contributions and help to this thread so far. However ive litterally just scrolled through the whole thread to find that you have not given the full css script that allows images instead of block colours.

I wish to have 3 different images, 1 image with an arrow on to indicate further trees, 1 image that is plain to indicate no further trees and a hover image.

Could you please supply the css to accomodate this. I had a go myself with no luck!

Many thanks!

[ckosloff]

I wish to have 3 different images...

The CSS for images is a previous version, which is also downloadable from the software add-ons area.
However, you will not get 3 images, just an image flip, which will work fine for your purpose.
I had it before and decided to move to only CSS because of positioning issues (if you change the width of sidebox or column you have to change your images).

[slomojojo]

I wish to have 3 different images, 1 image with an arrow on to indicate further trees, 1 image that is plain to indicate no further trees and a hover image.

It's easy to add images to the new release. In stylesheet_categories_menu.css, find the entry you want to add the image for, such as:

background-color: pink;

And then add an image as a background like this:

background-color: pink;
background-image: url(../myimagefolder/menu_image.jpg);

Check the site in my signature. I added 3 images to the menu that way.