Support for CSS Flyout Menu

[lat9]

What a great plugin! I'm glad someone posted here; I've been looking for this functionality for a while.

[Thannaree]

Hi Get Em Fast,

I've installed this module and it works great! However, I have a slideshow on the homepage, which also uses jquery (namely 2 scripts: jscript_jquery.cycle.all.min and jscript_jquery-1.4.2.min) and the slideshow broke. I have removed the jscript_jquery that comes with this module and all works perfectly now. Is it okay to use it this way?

The site uses zencart 1.5 : http://goo.gl/wydFf

[Get Em Fast]

Yep, you can use it without jquery, and the menu will function just fine as pure css. BUT......................if you use Nivo-Slider as your image slider, they will work together just fine together.

[Thannaree]

Yep, you can use it without jquery, and the menu will function just fine as pure css. BUT......................if you use Nivo-Slider as your image slider, they will work together just fine together.

Okay...and thanks!!

[Get Em Fast]

Not a problem. But, it looks like you've got both of them working together now. Looks good.

[PeazzAndycresswell]

What a great plugin! I'm glad someone posted here; I've been looking for this functionality for a while.

Hi mate

I am pretty new to web design, zen cart and same with CSS but so far I've done alright, but I've come unhinged.

I've created the graphics and got the hover over effect I want on the first set of tabs (category's) but for the life of me I cannot get the same effect on the sub category bars... The image just doesn't seem to small properly, I can get the Mage to show on mouse over but it's just to small any help would be great, if you got Firefox web developer tools just edit CSS on the Xbox page u an see the full style sheet, I've been messing with the bit at the bottom..

I've tried setting image width to 147px which is its die and same setting for first set of tabs with a width of 100% I've tried anything I could find within the document and nothing's working pulling my hair out

Any help would be great

Www.consolecodeslab.com

[PeazzAndycresswell]

Hi mate

I am pretty new to web design, zen cart and same with CSS but so far I've done alright, but I've come unhinged.

I've created the graphics and got the hover over effect I want on the first set of tabs (category's) but for the life of me I cannot get the same effect on the sub category bars... The image just doesn't seem to small properly, I can get the Mage to show on mouse over but it's just to small any help would be great, if you got Firefox web developer tools just edit CSS on the Xbox page u an see the full style sheet, I've been messing with the bit at the bottom..

I've tried setting image width to 147px which is its die and same setting for first set of tabs with a width of 100% I've tried anything I could find within the document and nothing's working pulling my hair out

Any help would be great

Www.consolecodeslab.com

#dhtmlgoodies_menu{
	font-family:segoe ui;	/* Font for main menu items */
background-image: url(/images/mback.png) ;	  
list-style: none;
          width: 147px;
         
}
#dhtmlgoodies_menu	li{	/* Main menu <li> */
	list-style-type:none;	/* No bullets */
	margin:0px;	/* No margin - needed for Opera */
}
#dhtmlgoodies_menu ul{
	margin:0px;	/* No <ul> air */
	padding:0px;	/* No <ul> air */
}
#dhtmlgoodies_menu ul li ul{	/* Styling for those who doesn't have javascript enabled */
	padding-left:10px;
}
#dhtmlgoodies_menu	li a{	/* Main menu links */
	text-decoration:none;	/* No underline */
	color:#fff;	/* Blue text color */

	height:27px;	/* 20 pixel height */
	line-height:30px;	/* 20 pixel height */
	vertical-align:middle;	/* Align text in the middle */
	margin:1px;	/* A little bit of air */
	padding:1px;	/* Air between border and text inside */
        text-align:center;


	display:block;
}
#dhtmlgoodies_menu	li a:hover,#dhtmlgoodies_menu .activeMainMenuItem{
	background-image: url(/images/mback1.png) ;
        text-align:center;
        text-decoration:underline;
}
.dhtmlgoodies_subMenu{
	visibility:hidden;
	position:absolute;
	overflow:hidden;
	background-image: url(/images/mback.png) ;
        width: 145px;
	font-family:arial;
	text-align:center;

}
.dhtmlgoodies_subMenu ul{
	margin:0px;
	padding:3px;
}
.dhtmlgoodies_subMenu ul li{
	list-style-type:none;
	margin:0px;
	padding:6px;	/* 1px of air between submenu border and sub menu item - (the "white" space you see on mouse over )*/
}
.dhtmlgoodies_subMenu ul li a{	/* Sub menu items */
	white-space:nowrap;	/* No line break */
	text-decoration:none;	/* No underline */
	color:#fff;	/* Black text color */

	height:11px;	/* 16 pixels height */
	line-height:16px;	/* 16 pixels height */
	padding:1px;	/* 1px of "air" inside */

	display:block;	/* Display as block - you shouldn't change this */
}
.dhtmlgoodies_subMenu ul li a:hover{	/* Sub menu items - mouse over effects */
	background-image: url(/images/mback1.png) ;
	color:#bcdc65;	/* White text */
        vertical-align: middle;
        font-family:segoe ui;

}

[PeazzAndycresswell]

still not figured this one out :'(