Support for CSS Flyout Menu

[gjh42]

Just tested some flyout code on Categories Dressing, and it does work without impeding any other mod styling or function.
Something like this (adjusted to #chcategories):

#categories ul ul {display: none;}
#categories li:hover {position: relative;}
#categories li:hover>ul {display: block; position:absolute; left:130px; top:0; z-index:100; width:140px;}
#categories ul ul ul {display: none;}
#categories li li:hover>ul {display: block; position:absolute; left:130px; top:0; z-index:200; width:140px;}
#categories ul ul ul ul {display: none;}
#categories li li li:hover>ul {display: block; position:absolute; left:130px; top:0; z-index:300; width:140px;}

We now return you to your regularly scheduled mod... :)

[gjh42]

Just missed the edit window... it can be simplified to

#categories ul ul {display: none;}
#categories li:hover {position: relative;}
#categories li:hover>ul {display: block; position:absolute; left:130px; top:0; z-index:100; width:140px;}

[Get Em Fast]

Ya' know, Glen, I've been meaning for quite some time to see if maybe these two could be merged. That would make an absolute great menu..............add a couple lines of jquery to go with it (I've actually got the Horizontal CSS Dropdown Menu working very nicely with jquery, and am about to add a jquery version of it AND this one)........hmmmm........
But, oh...........I've just been sooooooo busy, lately. Not that I'm complaining, or anything...............

[gjh42]

I was pleasantly surprised to see how simple it was to get the flyout functionality on Cat Dressing. I haven't looked at all of the CSS Flyout Menu code, but I think they have fundamentally different base coding to arrive at some of the same output. I'm not sure how much difference there is in the styling that makes the flyout action, though... probably not much. How much does jquery need to be woven into the PHP to work on something like this? Any at all? Or does it just modify the output once it gets to the user's screen? I may try some CSS3 transitions or something to see if I can get slick effects for modern browsers without adding jquery to the mix.

[Get Em Fast]

Yea, I kind of wish I had a little more time right now to mess with it, but as of the moment, I'm pretty swamped.

You know, I haven't even tried the jquery with this menu, yet, but almost everything about this menu and the CSS Dropdown Menu is the same except for the css, so I'm almost sure it would just be a simple matter of dropping the javascript in the tpl_header.php.

Well, actually.............I just very quickly took a minute to do a test run with it, and it worked just fine. All you have to do is add jquery to your jscript folder, rename it to jscript_jquery.js then drop this in the tpl_header.php:

<script type="text/javascript">
//script copyright Get Em Fast Web Designs
$(function () {
        $('#nav-cat .level1 .submenu.submenu').hover(function() {
$(this).find('ul.level2,.level3 li,.level4 li,.level5 li,.level6 li').stop(true, true).hide(1000);
$(this).find('ul.level2,.level3 li,.level4 li,.level5 li,.level6 li').stop(true, true).show(1000);
}, function() {
$(this).find('ul.level2,.level3 li,.level4 li,.level5 li,.level6 li').stop(true, true).show(1000);
$(this).find('ul.level2,.level3 li,.level4 li,.level5 li,.level6 li').stop(true, true).hide(1000);
});});
</script>

You can change it to FadIn and FadeOut also, but I think the hide and show looks better.

[DontBlink7]

i'm new to the zen cart store, and would appreicate it if anyone would share how to remove Important Links Sidebox, iv'e tried to remove it from Admin/tools/Layoutboxescontroler but it doesn't show up there.

My site is here: BudgetA/C online store

[gjh42]

This question has nothing to do with the thread topic, and you should post new questions in a new thread (go to the appropriate forum and click "new thread").
The Important Links sidebox is named ez-pages in the layout controller.

[sportbiker]

I'm curious - it seems there was some discussion about Category Dressing being able to work with this mod http://www.zen-cart.com/forum/showpo...&postcount=590 but I'm not clear on the final outcome. Was this achieved? I'd hate to tweak a working flyout menu system if Category Dressing doesn't work.

Ultimately, I'm just looking to add headers in the menu system.

[gjh42]

It's not that Categories Dressing can work with this mod, but that you can get flyout functionality in CD with a few style rules added to it. There is more detail in the CD support thread.

[sportbiker]

Awesome to hear and thank you for taking the time to answer. It clears it up a bit for me. I'll do a little more digging and playing with these and see where it goes. :-)