Support for CSS Flyout Menu

[ckosloff]

Hi Ckosloff,
I faced a Problem to change the color the same like my template,
pls kindly look my attachment(the left is the one I changed from the CSS FLYOUT, the right one is the original module of my template), I want my CSS FLYOUT has the same color like my template...

First thing I noticed is that your CSS is messed up.
For example, there are two body tags, repeated categories, etc.
The first thing I would do is clean up the CSS, you will find plenty examples in the thread on how a CSS should look.
Try pasting one of the "good" CSS onto your test site and check out the looks, it will be easy to take it from there.
You will just need to play around with the hex codes to find which ones you like, or check with the template maker which hex codes they used.
By the way, you do have a test site, right?
If you don't, you need to start there.
My suggestion would be to buy the Zen Cart manual, and build the test site first.

[preman]

First thing I noticed is that your CSS is messed up.
For example, there are two body tags, repeated categories, etc.
The first thing I would do is clean up the CSS, you will find plenty examples in the thread on how a CSS should look.
Try pasting one of the "good" CSS onto your test site and check out the looks, it will be easy to take it from there.
You will just need to play around with the hex codes to find which ones you like, or check with the template maker which hex codes they used.
By the way, you do have a test site, right?
If you don't, you need to start there.
My suggestion would be to buy the Zen Cart manual, and build the test site first.

Yep, you are right, I have a test site,with your kind advices,I shall figure out them myself,this is my test site used CHERRY ZEN template www.youtoimport.com
Thank you very much

[preman]

Yep, you are right, I have a test site,with your kind advices,I shall figure out them myself,this is my test site used CHERRY ZEN template www.youtoimport.com
Thank you very much

First thing I noticed is that your CSS is messed up.
For example, there are two body tags, repeated categories, etc.
The first thing I would do is clean up the CSS, you will find plenty examples in the thread on how a CSS should look.
Try pasting one of the "good" CSS onto your test site and check out the looks, it will be easy to take it from there.
You will just need to play around with the hex codes to find which ones you like, or check with the template maker which hex codes they used.
By the way, you do have a test site, right?
If you don't, you need to start there.
My suggestion would be to buy the Zen Cart manual, and build the test site first.

Hi Ckosloff,

I need your help please, how could I change my css flyout style like the AMAZON ? I attached the photo below:

This is my CSS content,could you pls help me to revise it ?

body { behavior: url(includes/csshover.htc);} /* WinIE behavior call */
div#nav-cat {float: left; width: 140px;
background-color: #E8E9E9; font-weight:0;}
div#nav-cat ul {margin: 0; padding: 0; width: 140px; background-color:#E8E9E9;
/* border: 1px solid #E8E9E9;*/}
div#nav-cat ul.level2 {background-color: #E8E9E9;}
div#nav-cat ul.level3 {background-color: #E8E9E9;}
div#nav-cat ul.level4 {background-color: #E8E9E9;}
div#nav-cat ul.level5 {background-color: #E8E9E9;}
div#nav-cat li {position: relative; list-style: none; margin: 0;
/* border-bottom: 1px solid #E8E9E9;*/}
div#nav-cat li:hover {background-color: #E8E9E9;}
div#nav-cat li.submenu {
background: url(../images/submenu.gif) 95% 50% no-repeat;
background-color: #E8E9E9;}
div#nav-cat li.submenu:hover {background-color: #E8E9E9;}
div#nav-cat li a {display: block; padding: 0.25em 0 0.25em 0.5em;
text-decoration: none; width: 140px; color: black;}
/*border-left: 0.5em solid #BBB;}
div#nav li a:hover {border-left-color: red;}*/
div#nav-cat>ul a {width: auto;}
div#nav-cat ul ul {position: absolute; top: 0; left: 140px;
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 {display:block;}


Thank you very much !

[ckosloff]

Hi Ckosloff,
I need your help please, how could I change my css flyout style like the AMAZON ? I attached the photo below:
This is my CSS content,could you pls help me to revise it ?

Hi,
I cannot do the whole testing for you, however I can give you a hint.
Try using negative margins for subcats., like -5, for example, this will push them to the left.
Please bear in mind that this might not display well in IE6.
You will need to test different settings, save a copy of your file if it works and just sweat it out.

[preman]

Hi,
I cannot do the whole testing for you, however I can give you a hint.
Try using negative margins for subcats., like -5, for example, this will push them to the left.
Please bear in mind that this might not display well in IE6.
You will need to test different settings, save a copy of your file if it works and just sweat it out.

Thank you very much

[reneberg]

Hi guys

Here it goes..... I have installed SHOW/HIDE categories wich someone said is build upon the CSS Flyout menu.

And i was just wondering if anyone knows if it might be possible to expand the subcategories a little bit slower, sort of ajax style....

It may be possible with categories_css.js

thanx in advance

[e81ny]

Hello everyone,

OK. This is driving me crazy.. I pretty much have it the way I want it. But there is just this little thing that I can't seem to "fix" it.

Please go to this site: http://s266460223.onlinehome.us/shop

On FF and Safari, everything is fine. But on IE (both IE 6 and 7), if you move your cursor from "Lighting" down to "Garden & Outdoor", you will see that the menu shift up and down a little. I've looked at every possible settings..

Can anybody tell me what I missed?

Any help will be appreciated. Thank you in advance.

[ckosloff]

Hello everyone,
OK. This is driving me crazy.. I pretty much have it the way I want it. But there is just this little thing that I can't seem to "fix" it.
Please go to this site: http://s266460223.onlinehome.us/shop
On FF and Safari, everything is fine. But on IE (both IE 6 and 7), if you move your cursor from "Lighting" down to "Garden & Outdoor", you will see that the menu shift up and down a little. I've looked at every possible settings..
Can anybody tell me what I missed?
Any help will be appreciated. Thank you in advance.

Checked your site, you didn't miss anything.
It's just the behavior of IE.
My advice is to stop worrying about petty things, nobody will notice.
It is a known bug, recurrent in this thread.

[Best Price Accessori]

Hi,

The flyout is brillant addon! Thanks.

I just need a bit of help. I would like the fount color on the sub menu to be white. If you go to www.bestpriceaccessories.com/shop you'll see what I mean.

Thanks

[gee38l]

Sorry to be a bit of a hi jack... But i noticed on your site (best price accessories) in my account dropdown you have a tab called order status, can you please tell me how i can get this on my site?