Support for CSS Flyout Menu

dudemaaan:

When I add the '<p></p>' I end up with a double white space and no line between the products and specials area.

I've tried <hr> with varying styles but It never comes out quite right. It's always a white section with a line in it. Or something else weird. All I really want is a grey line that divides it. I tried a <div> styled but then it changed my whole page some how so I took it off.

Find this section of code in the "stylesheet_categories_menu.css" (at the very top):

div#nav-cat {
     margin-top: 0em;
     background-color: #ffffff;
     width: 100%;
     margin-left: auto;
     margin-right: auto;
     font-weight: normal;
     font-size: 1.3em;
}
```and change the "background-color: #ffffff;" to transparent, making the whole section looking like this:

div#nav-cat {
margin-top: 0em;
background-color: transparent;
width: 100%;
margin-left: auto;
margin-right: auto;
font-weight: normal;
font-size: 1.3em;
}

Hope this helps.

awesome! that did it. Thanks!

dudemaaan:

awesome! that did it. Thanks!

Anytime. Glad to see you've got it worked out.

But, now that you've got it the way you want it, you might want to replace it, as FireFox isn't reading it............for some reason all I see when I went to edit your stylesheet_categories_menu.css, all I could see was: "ÿþb"..........that's it.....nothing else.

Did you recently install from a backup?
What editor do you use to edit you .css files?

I used dreamweaver and uploaded it via filezilla. I've heard dreamweaver isn't the best for editing the files but it seemed to always work for me. I've also had filezilla corrupt the files before when it wasn't set to bianary upload. So why is everything working and looking correctly on the site if the file is screwy?

Also where do you go in firefox to read the file? So that I can test or check for that in the future

I validated the CSS and it came back with this error

2 body Property behavior doesn't exist : url(includes/csshover.htc) url(includes/csshover.htc)
But I have the csshover.htc installed in the includes directory, so I dunno what else it wants.

EDIT: I think I figured out how to view the file in firefox. Using the developer kit "view source" and then click on the file. If that's the case, stylesheet_categories_menu.css seems to be okay now, aside from the CSS error that it showed me.

dudemaaan:

Also where do you go in firefox to read the file? So that I can test or check for that in the future

EDIT: I think I figured out how to view the file in firefox. Using the developer kit "view source" and then click on the file. If that's the case, stylesheet_categories_menu.css seems to be okay now, aside from the CSS error that it showed me.

If you have the developer kit, go to the "CSS" tab, then "Edit CSS". Then look at your stylesheet_categories_menu.css..........you'll see what I mean.

Seems like I've heard about Dreamweaver corrupting files, also.
You might try coping the file into notepad, and uploading to your server.

Hmm yeah I do see that. That's odd, because if you "view source" and click on the stylesheet it shows fine. And it works fine, it's just not showing up correctly in the css editor. When I download the file it views fine.

I tried saving it in notepad and replaced the file, but it's still doing the same thing.

EDIT: could it be due to the css error I'm getting in the stylesheet when I validate the css? I've tried numerous times but nothing is fixing that ÿþb thing.

I re-downloaded the CSS flyout addon, made no changes to the stylesheet_categories_menu.css and the ÿþb was still there after putting the completely default file on the site. shrug

Has anyone had any success in getting the CSS Flyout Menu mod to work property with the Hide Categories mod? I use the Hide Categories mode to prevent certain categories from showing up in the category menu but the CSS Flyout Menu mod shows all categories (even the ones designated as hidden by the Hide Categories mod).

I'm sure it's just a matter of making CSS Flyout Menu "aware" of the Hide Categories attributes but I'm not sure where to do that.

Any tips are greatly appreciated!!

Hello, I'm new to Zen Cart but I have had plenty of experience using CRE Loaded (their support is ########). So I'm ready to switch our store over but I have a couple of small problems.

First off, how do you remove the cateoreis from the Header? I'm using the Mistik tempalte and they go way off the side of the header/screen.

Second, the CSS Flyout menu doesn't work. It display all the categories and sub menus already open and there is no mouse over or pop-out at all.

I will locate the support thread for the tempalte as this si no the correct thread, but cince I ahd ot add one, I thought I would ask about both.

you can see what I mean at https://www.broadwyn-wear.com/zen

Thanks

bwear:

Hello, I'm new to Zen Cart but I have had plenty of experience using CRE Loaded (their support is ########). So I'm ready to switch our store over but I have a couple of small problems.

First off, how do you remove the cateoreis from the Header? I'm using the Mistik tempalte and they go way off the side of the header/screen.

Second, the CSS Flyout menu doesn't work. It display all the categories and sub menus already open and there is no mouse over or pop-out at all.

I will locate the support thread for the tempalte as this si no the correct thread, but cince I ahd ot add one, I thought I would ask about both.

you can see what I mean at www.broadwyn-wear.com/zen

Thanks

Remove Categories from header: Admin>Configuration Settings>E-Z Pages Settings>EZ-Pages Display Status - HeaderBar .............Set to 0.You can also choose which links you want up there.....Admin>Tools>E-Z Pages......anything you don't want displayed in the header, just check the green box beside it under the header column.
The menu that's on this page isn't the cssFlyout menu. You need to go to Admin>Tools>Layout Boxes Controller and set the "categories_css" to the "ON" position, and in the same time turn "OFF" any other "Categories" box you find.

That template...........Hmmmmmm....seems to me like it needs a lot of work. Support for it?.....................good luck.

Look at the bright side.........at least you DID find support for the Flyout Menu......but you need to turn it on before it works. :)

Get Em Fast:

Remove Categories from header: Admin>Configuration Settings>E-Z Pages Settings>EZ-Pages Display Status - HeaderBar .............Set to 0.You can also choose which links you want up there.....Admin>Tools>E-Z Pages......anything you don't want displayed in the header, just check the green box beside it under the header column.
The menu that's on this page isn't the cssFlyout menu. You need to go to Admin>Tools>Layout Boxes Controller and set the "categories_css" to the "ON" position, and in the same time turn "OFF" any other "Categories" box you find.

That template...........Hmmmmmm....seems to me like it needs a lot of work. Support for it?.....................good luck.

Look at the bright side.........at least you DID find support for the Flyout Menu......but you need to turn it on before it works. :)

Thanks with the reply. unfortunatly, that didn't remove the menu from the top. I also had already made the changes to the sideboxes that you mentioned. The categories show up but the menus are permenatly expanded. Check my link above to see what I mean.

Another dumb question, If I have a template that I ported to CRE Loaded from osCommerce, should that easily port to zencart as well?

bwear:

Thanks with the reply. unfortunatly, that didn't remove the menu from the top. I also had already made the changes to the sideboxes that you mentioned. The categories show up but the menus are permenatly expanded. Check my link above to see what I mean.

Yes, I see it.........but I know my menu, and that kind of behavior (with the links expanded) is ABSOLUTELY IMPOSSIBLE with the CSS FlyOut Menu (it couldn't do that on it's worst day). Maybe you installed a different one by mistake? Let's make ABSOLUTELY CERTAIN that you've got the correct one HERE.

bwear:

Another dumb question, If I have a template that I ported to CRE Loaded from osCommerce, should that easily port to zencart as well?

That shouldn't be a problem. Believe me.........is OSC can do it, ZC can do it better.

Or maybe, bwear, the "stylesheet_categories_menu.css" got corrupted during FTP, as it's not loading in FF or IE. And if it's not loading, well.............then it would not look OR act right. Check it, make sure all the information's there, maybe re-upload it to your server? Also might double-check the rest of the files for the menu, as well, making sure they're in the correct places with all the correct info?

Did you change anything, yet (on the menu), or is it "out of the box", still?

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.

Get Em Fast:

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.

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!

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>

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.

bwear:

I had noticed in the forums earlier, that the .CSS or the .htc might not be in the correct place.
Because of post #425 from dudemaan? That css error can be ignored. That property is only for IE to "flyout" the menu, and doesn't exist for other browsers, as they won't use it. You'll also find this question answered in the Horizontal Dropdown Menu thread, as it also uses the csshover.htc . You can also Google that error and find extensive reading on the topic.

bwear:

It is still "out of the box" except I renamed the "YOUR_CUTOMS_TEMPLATE_NAME" folder to mistik to match my template.

O.k. and you've went through all your files afterward, and made sure that ALL 5 files are indeed in the correct places?

Get Em Fast:

O.k. and you've went through all your files afterward, and made sure that ALL 5 files are indeed in the correct places?

Yes sir, as far as I can tell they are. I didn't move any around.