Support for CSS Flyout Menu

[bwear]

Done some more checking for ya. It IS the correct menu, so without loading the css correctly, I guess it CAN act that way.....sorry. I didn't take into account that it might could do that if the css didn't load.........so check it, as stated above.


Also, on second look at your site, that's the Categories-Tabs Menu at the top of your site. You can turn that off in Admin>Layout Settings>Categories-Tabs Menu ON/OFF. set to 0.

If you still can't get the Flyout Menu to work, give us another post, and we'll work until it does.

Thank you! Someone who actually supports their work, and understand "Open Source". Alright, now i'm a little forclempt and need a moment, Talk amongst yourselves. Let me give you a topic... CRE Loaded and the rat ##############s that take your money and offer no supporrt.....

Alright now that that has passed, back to the CSS Flyout. I did downlaod it from the link you posted above and copied the files over as stated, but I had noticed in the forums earlier, that the .CSS or the .htc might not be in the correct place. It is still "out of the box" except I renamed the "YOUR_CUTOMS_TEMPLATE_NAME" folder to mistik to match my template.

[Spo0f]

Hi,

I have been trying to generate 3 different images..
- an image for when there is no event.
- an image for a roll over event.
- an image for when there is no event but there is a link tree (i.e same as the first but with an arrow on.)

so far i have only managed to get two images working...no event and roll over event. Can someone explain to me how to adjust my css code below to add an image when there is a a link tree.

Thanks in advance!


<code>
body {
behavior: url(./csshover.htc);
/* WinIE behavior call */}

div#nav-cat {
width: 185px;
margin: 0px 0 0 0px;
background-color: #EBEBEB;
font-weight:bold;
color:#C6C6C6;
text-align: right;
line-height: 28px;
background-image:url(../images/#);
padding-bottom:20px;
background-repeat: no-repeat;
background-position:bottom;


}
div#nav-cat ul {margin: 0; padding: 0; padding-top: 0; width: auto; background-color: transparent;

border-top:#;


}

div#nav-cat ul.level2 {background-color: ################;
width:auto;
}

div#nav-cat ul.level3 {background-color: ################;
width:auto;
}
div#nav-cat ul.level4 {background-color: ################;
width:auto;
}
div#nav-cat ul.level5 {background-color: ################;
width:auto;
}
div#nav-cat ul.level6 {background-color: ################;
width:auto;
}
div#nav-cat li {background-image: url(../images/navbut.gif);

position: relative;
padding-right:0px;
list-style: none;
margin: 0px;
margin-top: 0px;
z-index: 20;
height: 28px;
width: 185px;
/* change it to whatever space you want to put space between buttons*/}
/* <---this line may help or hinder IE menu shifting issues */
div#nav-cat li li {
margin: 0px;
/* this overrides the margin-top in the declaration above */
}
div#nav-cat li:hover {
background-image: url(../images/b1_over.gif);

}
div#nav-cat li a:hover {color:#FFFFFF;


}
div#nav-cat li.submenu {

background-color: transparent;


}
div#nav-cat li.submenu:hover {background-color: transparent;
background-image: url(../images/b1_over.gif);

}
div#nav-cat ul {background-color: transparent;
}
div#nav-cat li a {display: block; padding: 0.25em 0 0.25em 2em;
width: 150px;}
/*border-left: 0.5em solid #BBB;}
div#nav li a:hover {border-left-color: red;}*/
}
div#nav li a:hover {border: none;

}
div#nav-cat>ul a {width: 150px;
}
div#nav-cat ul ul {position: absolute; top: 0; left: 185px;
display: none;
}
div#nav-cat ul.level1 li.submenu:hover ul.level2,
div#nav-cat ul.level2 li.submenu:hover ul.level3,
div#nav-cat ul.level3 li.submenu:hover ul.level4,
div#nav-cat ul.level4 li.submenu:hover ul.level5,
div#nav-cat ul.level5 li.submenu:hover ul.level6 {display:block;

}
</code>

[Get Em Fast]

SpoOf, when did you download your copy? Is that the old one, or did you delete all the hints, as the new one is "color coded" to make it easier for you to find your way around each level.

[Spo0f]

SpoOf, when did you download your copy? Is that the old one, or did you delete all the hints, as the new one is "color coded" to make it easier for you to find your way around each level.

Ive played around with it to work with my template and looks like ive deleted the hints! Have i made it to complicated to implement the tasks i wish to achieve?

Thanks for your speedy reply.

Kind regards

[Spo0f]

Ive played around with it to work with my template and looks like ive deleted the hints! Have i made it to complicated to implement the tasks i wish to achieve?

Thanks for your speedy reply.

Kind regards

Hi i have managed to solve it by playing around slightly more.

Thank you for your help :)

Kind regards.

[Get Em Fast]

Sorry Spoof......looks like you posted about the time I went to bed. Glad to hear you got it, though.

[Get Em Fast]

A couple of sites has recently had problems with their stylesheet_categories_menu.css either not loading correctly or not loading at all. So I tracked down and hopefully squished a bug.

The amended menu (CSS Flyout Menu 1.3.8a) has been submitted and should be available for download later.

In the mean time, if you need a copy you can pm me.

[darrin0]

Is it possible to use this same flyout menu for the information sidebox as well? If so, how would I go about doing that???

[Get Em Fast]

Is it possible to use this same flyout menu for the information sidebox as well? If so, how would I go about doing that???

Well, I don't know.....................what have you got in mind?

[darrin0]

Well, I don't know.....................what have you got in mind?

On the website I'm building - mybeatrice.com - I'm only using two sideboxes, the categories sidebox and the information sidebox. I would just like to get the information sidebox to match the category sidebox. So in other words I would like the links that are normally located under the Information sidebox (privacy policy, contact us, etc.) to flyout similar to the menu I've created for the categories.