Extended Menu

Do you have an Open Source Product available for Joomla!? Let everyone know here.
Locked
shadeshigeru
Joomla! Apprentice
Joomla! Apprentice
Posts: 23
Joined: Mon Dec 03, 2007 1:26 am

Re: Extended Menu

Post by shadeshigeru » Wed Feb 13, 2008 2:00 pm

Ok, i sucessfully split the sub menu and the main menu into 2 different modules so i should be able to style them differently 'havent gotten there quite yet.'

My issue now is, when a subnavigation item is active, the parent item does not show active status. How can i achieve this?

Thank you for your help.

 
shadeshigeru
Joomla! Apprentice
Joomla! Apprentice
Posts: 23
Joined: Mon Dec 03, 2007 1:26 am

Re: Extended Menu

Post by shadeshigeru » Thu Feb 14, 2008 9:37 am

I got it all working how i want it to, however i'm not quite sure how i did it and i believe i have some code that is not necessary. Here is what i have for the active state, can you please tell me what i have, that is not required? Thanks


Code: Select all

/*Active State*/	
a#active_menu-nav, a#active_menu-nav:hover, a.mainlevel_active-nav, a.mainlevel_active-nav:hover, a.mainlevel_current-nav, a.mainlevel_current-nav:hover {
background: #0c91c1 url('../../visual/bg-nav-left.gif') no-repeat 0 -104px;
margin: 0 1px 0 0; 
padding: 0 0 0 14px;
color: #fff;	 
font-size: 13px;
text-decoration:none;	
display: inline;
float: left;
cursor:pointer;   
}

a#active_menu-nav span, a#active_menu-nav:hover span, a.mainlevel_active-nav span, a.mainlevel_active-nav:hover span, a.mainlevel_current-nav span, a.mainlevel_current-nav:hover span  {
background: #0c91c1 url('../../visual/bg-nav-right.gif') no-repeat 100% -104px;
padding: 5px 14px 6px 0;  
display: block;
float: left;
cursor:pointer; 
}

a6april
Joomla! Apprentice
Joomla! Apprentice
Posts: 22
Joined: Fri Feb 15, 2008 5:09 pm

Re: Extended Menu

Post by a6april » Sat Feb 16, 2008 8:09 am

Hi Daniel,
Where is the link to download the 2.0 version, I went to your site: http://de.siteof.de/extended-menu.html and there was only version 1.03

Kelmi00
Joomla! Fledgling
Joomla! Fledgling
Posts: 2
Joined: Mon Feb 25, 2008 4:45 pm

Re: Extended Menu

Post by Kelmi00 » Mon Feb 25, 2008 4:53 pm

Hey,

trying to use my site with Internet Explorer, there appears to be problem with Extended menu. All of the line.gif -images are not shown. What to do!? I'm not sure if there is already answer for this, but at least I tried to use the search..

To get my point, see the page: http://www.fcvaajakoski.com/fcv/index.p ... &Itemid=57
---

Problem solved. empty.gif was missing.

User avatar
muskiediver
Joomla! Intern
Joomla! Intern
Posts: 92
Joined: Tue Aug 23, 2005 12:15 pm

Re: Extended Menu

Post by muskiediver » Mon Mar 03, 2008 7:27 pm

I am using Extended Menu, when I have a menu item listed as Separator / Placeholder it shows up clear (see image - Online Forms under Education).

Image

Notice "Online Forms" has no white background like the rest of the menu items. How can I fix this so "online forms" does have a white background like the rest of the menu items under the education category?

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Wed Mar 26, 2008 3:31 am

i have problem on my site. I might missed a lot of this thread's great solution but i use the search and still cant find how to fix my problem. I guess the solution is very simple but i have less knowledge about this.

I use Extended Menu and suckerfish vertical, everything is look fine on Firefox but the problem goes on IE6 and 7. On IE6 my submenu didnt show at all while on IE7 my submenu show or jump at other places.

thanks for any help...

User avatar
ljk
Joomla! Guru
Joomla! Guru
Posts: 756
Joined: Sat Jan 28, 2006 11:51 pm
Location: West Kelowna, BC
Contact:

Re: Extended Menu

Post by ljk » Wed Mar 26, 2008 4:10 pm

Hi,

Try this code:

Code: Select all

<!--[if IE]>
<style type="text/css" media="screen">
ul.mainlevel-suckerfish-vertical li, #vertnav ul li {
	float:left;
	width: 100%;
}
ul.mainlevel-suckerfish-vertical li a, #vertnav ul li a {
	height: 1%;
}
</style>
<![endif]-->
where #vertnav is the id of the div that the menu is contained in.

This will help some of your problems.
Laurelle
Keashly.ca Consulting
http://www.keashly.ca

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Thu Mar 27, 2008 1:38 am

well seems i still cant get it right... so please check my code below and tell what and where to add the script...

Code: Select all

/** IE bugs: a:link, a:visited, a:hover need to be styled as well; does not display separator... workaround? */
/** customize colors here */
a.mainlevel-suckerfish-vertical, a.mainlevel_active-suckerfish-vertical, a.mainlevel_current-suckerfish-vertical,
a.mainlevel-suckerfish-vertical:link, a.mainlevel_active-suckerfish-vertical:link, a.mainlevel_current-suckerfish-vertical:link,
a.mainlevel-suckerfish-vertical:visited, a.mainlevel_active-suckerfish-vertical:visited, a.mainlevel_current-suckerfish-vertical:visited {
	background-color: black;
	color: white;
}

a.mainlevel-suckerfish-vertical:hover, a.mainlevel_active-suckerfish-vertical:hover, a.mainlevel_current-suckerfish-vertical:hover {
	background-color: #E0E0E0;
	color: black;
}

a.sublevel-suckerfish-vertical, a.sublevel_active-suckerfish-vertical, a.sublevel_current-suckerfish-vertical,
a.sublevel-suckerfish-vertical:link, a.sublevel_active-suckerfish-vertical:link, a.sublevel_current-suckerfish-vertical:link,
a.sublevel-suckerfish-vertical:visited, a.sublevel_active-suckerfish-vertical:visited, a.sublevel_current-suckerfish-vertical:visited {
	background-color: black;
	color: white;
}

a.sublevel-suckerfish-vertical:hover, a.sublevel_active-suckerfish-vertical:hover, a.sublevel_current-suckerfish-vertical:hover {
	background-color: #E0E0E0;
	color: black;
}

ul.mainlevel-suckerfish-vertical ul ul a.sublevel-suckerfish-vertical, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_active-suckerfish-vertical, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_current-suckerfish-vertical,
ul.mainlevel-suckerfish-vertical ul ul a.sublevel-suckerfish-vertical:link, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_active-suckerfish-vertical:link, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_current-suckerfish-vertical:link,
ul.mainlevel-suckerfish-vertical ul ul a.sublevel-suckerfish-vertical:visited, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_active-suckerfish-vertical:visited, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_current-suckerfish-vertical:visited {
	background-color: black;
	color: white;
}

ul.mainlevel-suckerfish-vertical ul ul a.sublevel-suckerfish-vertical:hover, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_active-suckerfish-vertical:hover, ul.mainlevel-suckerfish-vertical ul ul a.sublevel_current-suckerfish-vertical:hover {
	background-color: #E0E0E0;
	color: black;
}

ul.mainlevel-suckerfish-vertical .expanded {
	display: block;
	background-image: url("../images/arrow_right.gif");
	background-position: right center;
	background-repeat: no-repeat;
	padding-right: 10px;
}


/** customize style / layout here */
a.mainlevel-suckerfish-vertical, a.mainlevel_active-suckerfish-vertical, a.mainlevel_current-suckerfish-vertical, span.mainlevel-suckerfish-vertical,
a.mainlevel-suckerfish-vertical:link, a.mainlevel_active-suckerfish-vertical:link, a.mainlevel_current-suckerfish-vertical:link,
a.mainlevel-suckerfish-vertical:visited, a.mainlevel_active-suckerfish-vertical:visited, a.mainlevel_current-suckerfish-vertical:visited,
a.mainlevel-suckerfish-vertical:hover, a.mainlevel_active-suckerfish-vertical:hover, a.mainlevel_current-suckerfish-vertical:hover,
a.sublevel-suckerfish-vertical, a.sublevel_active-suckerfish-vertical, a.sublevel_current-suckerfish-vertical, span.sublevel-suckerfish-vertical,
a.sublevel-suckerfish-vertical:link, a.sublevel_active-suckerfish-vertical:link, a.sublevel_current-suckerfish-vertical:link,
a.sublevel-suckerfish-vertical:visited, a.sublevel_active-suckerfish-vertical:visited, a.sublevel_current-suckerfish-vertical:visited,
a.sublevel-suckerfish-vertical:hover, a.sublevel_active-suckerfish-vertical:hover, a.sublevel_current-suckerfish-vertical:hover {
	font-weight: normal;
	font-size: 100%;
	text-align: left;
	text-decoration: bold;
	display: block;
	border: 1px solid silver;
	padding: 0.3em 0.5em 0.3em 0.5em;	/* top, right, bottom, left */
	height: 1em;
	line-height: 1em;
}

a.mainlevel-suckerfish-vertical, a.mainlevel_active-suckerfish-vertical, a.mainlevel_current-suckerfish-vertical, span.mainlevel-suckerfish-vertical {
}

a.sublevel-suckerfish-vertical, a.sublevel_active-suckerfish-vertical, a.sublevel_current-suckerfish-vertical, span.sublevel-suckerfish-vertical {
	font-size: 90%;
	border-top: 0px solid silver;
}

#active_menu-suckerfish-vertical,
a.mainlevel_active-suckerfish-vertical, a.mainlevel_current-suckerfish-vertical,
a.mainlevel_active-suckerfish-vertical:link, a.mainlevel_current-suckerfish-vertical:link,
a.mainlevel_active-suckerfish-vertical:visited, a.mainlevel_current-suckerfish-vertical:visited,
a.mainlevel_active-suckerfish-vertical:hover, a.mainlevel_current-suckerfish-vertical:hover,
a.sublevel_active-suckerfish-vertical, a.sublevel_current-suckerfish-vertical,
a.sublevel_active-suckerfish-vertical:link, a.sublevel_current-suckerfish-vertical:link,
a.sublevel_active-suckerfish-vertical:visited, a.sublevel_current-suckerfish-vertical:visited,
a.sublevel_active-suckerfish-vertical:hover, a.sublevel_current-suckerfish-vertical:hover {
	font-weight: bold;
}

ul.mainlevel-suckerfish-vertical, .mainlevel-suckerfish-vertical ul {
	padding: 0;
	margin: 0;
	list-style: none;
	width: 10em;
}

ul.mainlevel-suckerfish-vertical {
	z-index: 101;
}

ul.mainlevel-suckerfish-vertical ul {
	z-index: 102;
}

ul.mainlevel-suckerfish-vertical ul ul {
	z-index: 103;
}

ul.mainlevel-suckerfish-vertical li {
	padding: 0;
	margin: 0;
	background: none;
	list-style: none;
	float: left;
	clear: left;
	position: relative;
	width: 14.4em;
}

ul.mainlevel-suckerfish-vertical li li {
}

ul.mainlevel-suckerfish-vertical ul {
	display: none;
	position: absolute;
	top: 0;
	margin-left: 14.4em;
}

ul.mainlevel-suckerfish-vertical li:hover ul,
ul.mainlevel-suckerfish-vertical li.hover ul {
	display: block;
}


ul.mainlevel-suckerfish-vertical li:hover ul ul,
ul.mainlevel-suckerfish-vertical li.hover ul ul {
	display: none;
}

ul.mainlevel-suckerfish-vertical li:hover ul li:hover ul,
ul.mainlevel-suckerfish-vertical li.hover ul li.hover ul {
	display: block;
}


ul.mainlevel-suckerfish-vertical, ul.mainlevel-suckerfish-vertical li li {
	clear: left;
}

/** separator */
span.mainlevel-suckerfish-vertical, span.sublevel-suckerfish-vertical {
	border-width: 0px;
	padding: 5px;
}
and please also check my site here at http://www.indonesiapullingteeth.com

User avatar
ljk
Joomla! Guru
Joomla! Guru
Posts: 756
Joined: Sat Jan 28, 2006 11:51 pm
Location: West Kelowna, BC
Contact:

Re: Extended Menu

Post by ljk » Fri Mar 28, 2008 4:50 pm

Hi,

Leave the suckerfish-vertical/css/menu.css as it is

Add the code I posted above in the <head> section of your template file (index.php).

Good luck.

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Sat Mar 29, 2008 1:49 am

Hi Ijk,

still not fixing my IE6 problem, the submenu still not showing but i havent check it on IE7... will you kind enough to check my index.php... :-[

Thanks a lot...

Code: Select all

<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--[if IE]>
<style type="text/css" media="screen">
ul.mainlevel-suckerfish-vertical li, #vertnav ul li {
   float:left;
   width: 100%;
}
ul.mainlevel-suckerfish-vertical li a, #vertnav ul li a {
   height: 1%;
}
</style>
<![endif]-->


<?php mosShowHead(); ?>
<?php
if ( $my->id ) {
	initEditor();

}
$collspan_offset = ( mosCountModules( 'right' ) + mosCountModules( 'user2' ) ) ? 2 : 1;
//script to determine which div setup for layout to use based on module configuration
$user1 = 0;
$user2 = 0;
$colspan = 0;
$right = 0;
// banner combos

//user1 combos
if ( mosCountModules( 'user1' ) + mosCountModules( 'user2' ) == 2) {
	$user1 = 2;
	$user2 = 2;
	$colspan = 3;
} elseif ( mosCountModules( 'user1' ) == 1 ) {
	$user1 = 1;
	$colspan = 1;
} elseif ( mosCountModules( 'user2' ) == 1 ) {
	$user2 = 1;
	$colspan = 1;
}


//right based combos
if ( mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' ) ) {
	$right = 1;
}
?>

<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/css/template_css.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div align="center">
	<table border="0" cellpadding="0" cellspacing="0" width="808">
		<tr>
			<td class="outline">
		  		<div id="buttons_outer">
		  		  <div id="buttons_inner">
						<div id="buttons">
						<?php mosLoadModules ( 'user3', -1); ?>
						</div>
					</div>
		  		</div>
		  		<div id="search_outer">
		  		  <div id="search_inner">
		  		  <?php mosLoadModules ( 'user4', -1 ); ?>
		  		  </div>
		  		</div>
		  		<div class="clr"></div>
		  		<div id="header_outer">
		  			<div id="header">
		  			&nbsp;
		  			</div>
		  			<div id="top_outer">
						<div id="top_inner">
						 </div>
				  </div>
		  		</div>
		  		<div id="left_outer">
		  			<div id="left_inner">
		  			<?php mosLoadModules ( 'left', -2 ); ?>
		  			</div>
		  		</div>
		  		<div id="content_outer">
					<div id="content_inner">
					<?php
		  			if ( mosCountModules ('banner') ) {
		  				?>
		  				<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">
						<tr>
								<td>

									<div id="banner_inner">


			  					<?php mosLoadModules( 'banner', -1 ); ?><br />
									</div>
									<div id="poweredby_inner">
										<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/metclub.png" alt="metclub.png, 1 kB" title="MetClub" border="0" height="81" width="168" /><br />

									</div>

								</td>
							</tr>
							</table>
							<?php
		  			}
		  			?>
		  			<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">
						<tr valign="top">
							<td width="99%">
								<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">

								<?php
								if ($colspan > 0) {
								?>
									<tr valign="top">
										<?php
				  					if ( $user1 > 0 ) {
				  						?>
				  						<td width="50%">
				  							<div class="user1_inner">
				  							<?php mosLoadModules ( 'user1', -2 ); ?>
				  							</div>
				  						</td>
				  						<?php
				  					}
				  					if ( $colspan == 3) {
										 ?>
											<td width="2">
												<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/spacer.png" alt="" title="spacer" border="0" height="10" width="2" />
											</td>
										<?php
										}
				  					if ( $user2 > 0 ) {
				  						?>
				  						<td width="50%">
				  							<div class="user2_inner">
				  							<?php mosLoadModules ( 'user2', -2 ); ?>
				  							</div>
				  						</td>
				  						<?php
				  					}
										?>
									</tr>
									<tr>
										<td colspan="<?php echo $colspan; ?>">
											<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/spacer.png" alt="" title="spacer" border="0" height="2" width="100" /><br />
										</td>
									</tr>
									<?php
									}
								?>
								<tr>
									<td colspan="<?php echo $colspan; ?>">
										<div id="pathway_text">
										<?php mosPathWay(); ?>
										</div>
									</td>
								</tr>
								<tr>
									<td colspan="<?php echo $colspan; ?>" class="body_outer">
				  					 <?php mosMainBody(); ?>
									</td>
								</tr>
								</table>


							</td>
							<?php
							if ( $right > 0 ) {
		  				?>
		  				<td>
			  				<div id="right_outer">
			  					<div id="right_inner">
			  					<?php mosLoadModules ( 'right', -2 ); ?>
			  					</div>
			  				</div>
		  				</td>
		  				<?php
		  			}
		  			?>

						</tr>
						</table>
		  		</div>
		  	</div>
		  </td>
	  </tr>
  </table>
</div>
<?php include_once( $GLOBALS['mosConfig_absolute_path'] . '/includes/footer.php' ); ?>
<?php mosLoadModules( 'debug', -1 );?>
</body>
</html>

User avatar
TomT
Joomla! Ace
Joomla! Ace
Posts: 1270
Joined: Thu Aug 18, 2005 5:50 am
Location: Amsterdam
Contact:

Re: Extended Menu

Post by TomT » Sat Mar 29, 2008 8:16 am

Did you put the folder js with the file menu.js in the folder of your template?

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Sun Mar 30, 2008 5:48 am

yes sir, i did put the .js on this following folder /templates/rhuk_solarflare_ii/menu.js

btw, should the menu.js is placed in js folder...?

User avatar
TomT
Joomla! Ace
Joomla! Ace
Posts: 1270
Joined: Thu Aug 18, 2005 5:50 am
Location: Amsterdam
Contact:

Re: Extended Menu

Post by TomT » Sun Mar 30, 2008 12:00 pm

pahlevy wrote:
btw, should the menu.js is placed in js folder...?
I think so. I have them i a folder named js, I think extended menu refers to this folder.

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Sun Mar 30, 2008 1:57 pm

omg... thanks tom... you solved my problem its just as simple as it...

thanks also for everyone who trying to help... ;)

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Mon Mar 31, 2008 12:59 am

but still on IE6 my extended menu / submenu wasn't show at all...

wildorchid
Joomla! Apprentice
Joomla! Apprentice
Posts: 14
Joined: Sun Feb 18, 2007 9:11 am

Re: Extended Menu horizontal + vertical

Post by wildorchid » Wed Apr 02, 2008 10:17 am

Hello,

I use Extended Menu -suckerfish horizontal in the toolbar on Joomla 1 that came with a template called jsn-epic.

I'm trying now to substitute the Main Menu on the left column with another instance of Extended Menu but vertical.

I've downloaded suckerfish-vertical-1.0.1.zip and copied everything to jsn_epic/ext/extmenu/suckerfish-vertical.
I've made a copy of the Module Extended Menu and named it Menu
I've edited the properties Class Suffix = -suckerfish-vertical and the Template Name: /ext/extmenu/suckerfish-vertical/menu.html

It now shows a vertical menu with bullets but I think this is not the suckerfish-vertical style :'(

What could I have configured wrong?

Thanks for your help.

pahlevy
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Wed Mar 26, 2008 3:04 am

Re: Extended Menu

Post by pahlevy » Thu Apr 03, 2008 1:06 am

have you set the parameter in the extended menu from site module setting...

check if the setting for "Enable Menu Template" already set yes. and also make sure that the "Template Name" set to menu.html

hope its help u a bit...

bramalho
Joomla! Apprentice
Joomla! Apprentice
Posts: 5
Joined: Thu Feb 14, 2008 12:22 am

Re: Extended Menu

Post by bramalho » Fri Apr 04, 2008 9:27 pm

TomT wrote:
googolplexabyte wrote:
Is there any simple way to disable the parent items so they are not clickable links?
No there isn't. I has been posted here before: you need a javascript menu for that.
This really needs to be fixed.

wildorchid
Joomla! Apprentice
Joomla! Apprentice
Posts: 14
Joined: Sun Feb 18, 2007 9:11 am

Re: Extended Menu

Post by wildorchid » Sat Apr 05, 2008 6:33 am

pahlevy wrote:have you set the parameter in the extended menu from site module setting...

check if the setting for "Enable Menu Template" already set yes. and also make sure that the "Template Name" set to menu.html

hope its help u a bit...
Yes phalevy I have and it works for example with the -bulletree but not with -suckerfish-vertical.

maddunr
Joomla! Explorer
Joomla! Explorer
Posts: 312
Joined: Thu Oct 06, 2005 4:43 pm

[SOLVED] active/current item class bug in IE 6.0

Post by maddunr » Sun Apr 06, 2008 4:02 pm

Hello,

***UPDATE***

Apparently this is a well-documented (here and here) IE bug seen where multiple classes have the same id (#id1.class1, #id1.class2). The IE parser goes thru the list of styles, sees the first one and applies that style to the element. Then it moves the next one and sees that it has the same id and doesn't bother to check the class to see if it is different and skips everything else with the same id.

I solved the problem by having the module apply active/current highlighting to BOTH <li> and <a> elements (thanks to de for letting us do this in his module!!). I then applied regular state styling to the <li> element (#menuitem_1) and active state styling to the <a> element (#menulink_1), thus ensuring uniqueness of styles so stupid IE could see them :).


***********************
I have used ExMenu several times, but this is the first time I have run into this problem. I am using it for an image menu, as a flat list, with element id, without templates. The problem is that IE 6.0 doesn't show the current/active state or the rollover state. I am aware that IE doesn't handle :hover very well. I am really concerned about the current / active state. You can see the site in question here. (The top menu uses ExMenu)

Here is the html code generated (module suffix is -sub and menu suffix is -collection):

Code: Select all

<div class="moduletable-sub">
			<ul  id="menulist_root-collection" class="mainlevel-collection">
<li class="mainlevel_current-collection" id="menuitem_1-collection">
<a href="#" class="mainlevel-collection" id="menulink_1-collection">UPHOLSTERY</a>
</li>
<li class="mainlevel-collection" id="menuitem_2-collection">
<a href="#" class="mainlevel-collection" id="menulink_2-collection">WOODWORK</a>
</li></ul></div>
As you can see, I have applied the current/active highlighting to the <li> element only.

Here is my css (module suffix is -sub and menu suffix is -collection):

Code: Select all

/*this is where the text link is pushed below the div to hide it*/
.moduletable-sub a {display:block; padding-top:40px;} 

/*general styling for all li elements*/
ul.mainlevel-collection li {height:35px; padding:0; margin:0; list-style:none; overflow:hidden; float:left; vertical-align:top; text-align:left;} 

/*menu item 1 */
ul.mainlevel-collection li#menuitem_1-collection.mainlevel-collection {background:url(../images/nav_upholstery.jpg) no-repeat top left; width:130px;}
ul.mainlevel-collection li#menuitem_1-collection.mainlevel_current-collection {background:url(../images/nav_upholstery_active.jpg) no-repeat top left; width:130px;}
ul.mainlevel-collection li#menuitem_1-collection.mainlevel-collection:hover {background:url(../images/nav_upholstery_ro.jpg) no-repeat top left; width:130px;}

/*manu item 2 */
ul.mainlevel-collection li#menuitem_2-collection.mainlevel-collection {background:url(../images/nav_woodwork.jpg) no-repeat top left; width:120px;}
ul.mainlevel-collection li#menuitem_2-collection.mainlevel_current-collection {background:url(../images/nav_woodwork_active.jpg) no-repeat top left; width:120px;}
ul.mainlevel-collection li#menuitem_2-collection.mainlevel-collection:hover {background:url(../images/nav_woodwork_ro.jpg) no-repeat top left; width:120px;}
Can anyone pls shine some light as to why IE doesn't honor the active/current class styling? After all, it is simply just another class. Does it have something to do with the ordering of #id.class or .class#id?

Thanks in advance,
-V

friends1976
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Sun Apr 20, 2008 7:29 pm

Re: Extended Menu

Post by friends1976 » Fri Apr 25, 2008 12:49 am

I am new to joomla and I was wondering if someone could help me. I am using 1.0 and installed the extended menu. It is not wide enough to display the text in some instances. Does anyone know how to change that?

http://www.ashleybaileydesigns1.com

Thanks so much!
Ashley

User avatar
TomT
Joomla! Ace
Joomla! Ace
Posts: 1270
Joined: Thu Aug 18, 2005 5:50 am
Location: Amsterdam
Contact:

Re: Extended Menu

Post by TomT » Fri Apr 25, 2008 6:55 am

By changing the width of menulist_2_1-nav and sublevel-nav (and the active states of these classes too) in the css file of the menutemplate.

friends1976
Joomla! Apprentice
Joomla! Apprentice
Posts: 7
Joined: Sun Apr 20, 2008 7:29 pm

Re: Extended Menu

Post by friends1976 » Sat Apr 26, 2008 1:48 am

I don't know what you mean by "active states" of the classes. I think it is in the first part of the code I quoted here. But, I just don't know what to change or the setting to change it to. ???
/* @end */

/* @group Left Column */

/* @group Left Column Mainmenu List */

/* MainMenu Expandable Tables */

#leftcol a.mainlevel-sidenav, #leftcol a.mainlevel-sidenav2 {
height: 20px;
line-height: 20px;
display: block;
padding: 0px 0px 0px 12px;
background: url(../images/mainlevel.gif) no-repeat 0% 50%;
color: #666;
margin: 1px 0px 1px 0px;
border-top: 1px solid #fff;
font-size: 13px;
text-decoration: none;
}

#leftcol a.mainlevel-sidenav:hover, #leftcol a.mainlevel-sidenav2:hover {
height: 20px;
line-height: 20px;
display: block;
padding: 0px 0px 0px 12px;
background: url(../images/mainlevel_over.gif) no-repeat 0% 50%;
color: #333;
margin: 1px 0px 1px 0px;
border-top: 1px solid #fff;
font-size: 13px;
text-decoration: none;
}

#leftcol a.sublevel, #leftcol a.sublevel-sidenav, #leftcol a.sublevel-sidenav2 {
line-height: 16px;
display: block;
padding: 0px 0px 2px 10px;
color: #74AC00;
margin-bottom: 1px;
background: url(../images/mainlevel_sub.gif) no-repeat 0 50%;
text-decoration: underline;
font-size: 12px;
}

#leftcol a.sublevel:hover, #leftcol a.sublevel-sidenav:hover, #leftcol a.sublevel-sidenav2:hover {
color: #333;
text-decoration: underline;
}
/* MainMenu Flat List */



#leftcol ul#mainlevel, #leftcol ul#mainlevel-sidenav, #leftcol ul#mainlevel-sidnav2, #leftcol a.mainlevel-sidenav,#leftcol a.mainlevel-sidenav2, #leftcol a.mainlevel, #leftcol a.sublevel, #leftcol a.sublevel-sidenav, #leftcol a.sublevel-sidenav2 {
font-variant: normal;
font-style: normal;
font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
list-style:none;
}

#leftcol ul#mainlevel li a, #leftcol ul#mainlevel-sidenav li a, #leftcol ul#mainlevel-sidenav2 li a {
height: 18px;
display: block;
padding: 5px 0px 5px 18px;
background: #eee url(../images/mainlevel.gif) no-repeat 5px 50%;
color: #666;
text-decoration: none;
border: none;
}

#leftcol ul#mainlevel li a:hover, #leftcol ul#mainlevel-sidenav li a:hover, #leftcol ul#mainlevel-sidenav2 li a:hover {
height: 18px;
display: block;
padding: 5px 0px 5px 18px;
background: #fff url(../images/mainlevel.gif) no-repeat 5px 50%;
color: #666;
text-decoration: none;
border: none;
}




/* @end */


/* Left Column Globals */

#leftcol {
width: 228px;
float: left;
_overflow: hidden;
}


#leftcol a {
color: #333;
text-decoration: underline;
}

#leftcol a:hover {
color: #74AC00;
text-decoration: underline;
}


#leftcol .moduletable,
#leftcol .moduletablegreen,
#leftcol .moduletableblue,
#leftcol .moduletablered,
#leftcol .moduletableblack,
#leftcol .moduletablegray {
padding: 10px 5px 10px 0px;
}



#mainbody {
float: right;
margin: 0;
padding: 10px 0px 0px 0px;
width: 700px;
text-align: justify;
_background: #fff;
}

#mainbody .inside {
margin: 0;
padding: 0;
}

#bottombar {
background: url(../images/footer.png) no-repeat center top;
height: 9px;
width: 976px;
}

/* @end */

/* @group Joomla Styles */

.small, .modifydate, .createdate {
color: #b6b6b6;
font: .85em/.85em "Trebuchet MS", Tahoma, Verdana, Helvetica;
}

td.createdate {
text-indent: 20px;
line-height: 20px;
background: url(../images/clock_edit.png) no-repeat left center;
}

td.modifydate {
text-indent: 20px;
line-height: 20px;
background: url(../images/page_edit.png) no-repeat left center;
border-top: 1px dotted #f2f2f2;
}

form {
padding: 0;
margin: 0;
}

a.readon {
color: #74AC00;
display: block;
float: right;
line-height: 12px;
background: url(../images/readon.gif) no-repeat left center;
text-indent: 16px;
text-decoration: underline;
}
a.readon:hover {
color: #74AC00;
display: block;
float: right;
line-height: 12px;
background: url(../images/readon.gif) no-repeat left center;
text-indent: 16px;
text-decoration: none;
}

td.contentheading {
font: 1.75em Helvetica, Arial, Verdana, serif;
letter-spacing: -1px;
color: #0093E3;
border-bottom: 1px solid #eee;
width: 100%;
overflow: hidden;
}

.componentheading {
font: 1.75em Helvetica, Arial, Verdana, serif;
letter-spacing: -1px;
color: #74AC00;
border-bottom: 1px solid #eee;
margin-bottom: 15px;
}

a.contentpagetitle, .contentpagetitle a, .contentpagetitle a:visited {
color: #0E5199;
font: 1.25em "Trebuchet MS", Tahoma, Verdana, Helvetica;
letter-spacing: -1px;
}

a.contentpagetitle:hover, .contentpagetitle a:hover {
color: #333;
font: 1.25em "Trebuchet MS", Tahoma, Verdana, Helvetica;
letter-spacing: -1px;
}

div.syndicate div {
padding: 1px;
}

td.buttonheading a img {
padding: 0px 0px 0px 4px;
}

span.content_rating {
color: #888;
font-size: 10px;
text-transform: uppercase;
position: relative;
top: 5px;
}

label {
color: #8e8e8e;
}

div.mosimage {
border: 1px solid #eaeaea;
margin: 7px;
}

div.mosimage_caption {
padding: 2px;
background-color: #f7f7f7;
border-top: 1px solid #eee;
}

span.content_rating img {
padding-bottom: 10px;
margin: 0px;
}

div.back_button a {
color: #7f7f7f;
background-color: #eaeaea;
padding: 0px;
position: relative;
top: 10px;
float: none;
margin: 20px;
height: 16px;
display: block;
width: 50px;
text-align: center;
line-height: 16px;
text-transform: uppercase;
font-variant: small-caps;
font-size: 11px;
border: 1px solid #c0c0c0;
}

th.pagenav_prev a {
text-indent: -5000px;
display: block;
background: url(../images/next_prev.png) no-repeat 0px -44px;
width: 94px;
height: 22px;
border: none;
}

th.pagenav_prev a:hover {
text-indent: -5000px;
display: block;
background: url(../images/next_prev.png) no-repeat 0px -66px;
width: 94px;
height: 22px;
border: none;
}

th.pagenav_next a {
text-indent: -5000px;
display: block;
background: url(../images/next_prev.png) no-repeat 0px 0px;
width: 94px;
height: 22px;
border: none;
}

th.pagenav_next a:hover {
text-indent: -5000px;
display: block;
background: url(../images/next_prev.png) no-repeat 0px -22px;
width: 94px;
height: 22px;
border: none;
}

input.button {
color: #74AC00;
padding: 4px;
margin: 10px;
font-size: 10px;
background: url(../images/but_bg.png) repeat-x center center;
border:1px solid #ccc;
}

div.message {
color: #cd2800;
font-size: 18px;
font-weight: bold;
}

.inputbox {
border: 1px solid #999;
}

.moduletable .inputbox {
border: 1px solid #999;
height: 14px;
font: 11px Arial, Helvetica, Geneva, sans-serif;
color: #333;
}
/* @group Newsfeed Hacks */

form table.contentpane tbody tr td ul {
list-style: none;
}

form table.contentpane tbody tr td ul li {
background: url(../images/feed.png) no-repeat;
padding-left: 20px;
line-height: 20px;
text-decoration: none;
color: #74AC00;
}

form table.contentpane tbody tr td ul li a:hover {
color: #333;
background: #fff;
}

#mainbody .inside form table.contentpane tbody tr td {
width: auto;
}

/* @end */

/* @group Latest/Popular News Modules */

ul.latestnews,ul.mostread,
ul.latestnewsgreen,ul.mostreadgreen,
ul.latestnewsblue,ul.mostreadblue,
ul.latestnewsred,ul.mostreadred,
ul.latestnewsblack,ul.mostreadblack,
ul.latestnewsgray,ul.mostreadgray
{
list-style: none;
}

#leftcol a.latestnews, a.latestnews,
#leftcol a.latestnewsgreen, a.latestnewsgreen,
#leftcol a.latestnewsblue, a.latestnewsblue,
#leftcol a.latestnewsblack, a.latestnewsblack,
#leftcol a.latestnewsred, a.latestnewsred,
#leftcol a.latestnewsgray, a.latestnewsgray {
text-decoration: none;
background: url(../images/new.png) no-repeat 0 50%;
padding: 3px 0px 3px 20px;
line-height: 20px;
color: #666;
}
#leftcol a.mostread, a.mostread,
#leftcol a.mostreadgreen, a.mostreadgreen,
#leftcol a.mostreadblue, a.mostreadblue,
#leftcol a.mostreadred, a.mostreadred,
#leftcol a.mostreadblack, a.mostreadblack,
#leftcol a.mostreadgray, a.mostreadgray {
background: url(../images/book_open.png) no-repeat 0 50%;
padding-left: 20px;
padding: 3px 0px 3px 20px;
line-height: 20px;
text-decoration: none;
color: #666;
}
#leftcol a.latestnews:hover, a.latestnews:hover,
#leftcol a.mostread:hover, a.mostread:hover,
#leftcol a.latestnewsgreen:hover, a.latestnewsgreen:hover,
#leftcol a.mostreadgreen:hover, a.mostreadgreen:hover,
#leftcol a.latestnewsblue:hover, a.latestnewsblue:hover,
#leftcol a.mostreadblue:hover, a.mostreadblue:hover,
#leftcol a.latestnewsred:hover, a.latestnewsred:hover,
#leftcol a.mostreadred:hover, a.mostreadred:hover,
#leftcol a.latestnewsblack:hover, a.latestnewsblack:hover,
#leftcol a.mostreadblack:hover, a.mostreadblack:hover,
#leftcol a.latestnewsgray:hover, a.latestnewsgray:hover,
#leftcol a.mostreadgray:hover, a.mostreadgray:hover {
text-decoration: underline;
color: #74AC00;
}

/* @end */


/* @end */

/* @group Joomla Tables */

table.blog td {
padding: 0;
margin: 0;
}



table.contentpaneopen {
margin: 0;
padding: 0;
width: 100%;
}

table table.contentpaneopen td, table table.contentpane td {
margin: 0px 8px;
padding: 0;
width: 100%;
}

div.contentpane, div.contentpaneopen {
width: 100%;
}

table.contentpaneopen, table.contentpane, table.blog {
border-collapse: collapse;
padding: 3px;
width: 99%;
}

body.contentpane {
background: #fff;
margin: 25px;
}

td.sectiontableheader {
background: #0E5199 url(../images/sectblhdr.png) repeat-x top;
color: #FFF;
font-weight: bold;
height: 22px;
padding: 4px;
}

tr.sectiontableentry1 td {
padding: 2px;
background-color: #fbfbfb;
text-align: left;
border-bottom: 1px solid #fff;
border-top: 1px solid #dfdfdf;
}

tr.sectiontableentry2 td {
padding: 2px;
background-color: #f3f3f3;
text-align: left;
border-top: 1px solid #dfdfdf;
border-bottom: 1px solid #fff;
}

td.sectiontableentry1 {
padding: 2px;
background-color: #f8f8f8;
}

td.sectiontableentry2 {
padding: 2px;
background-color: #F2F2F2;
}

.sectiontableentry2 a, .sectiontableentry1 a, .sectiontableentry2 a.category, .sectiontableentry1 a.category {
padding-left: 4px;
color: #74ac00;
}

.sectiontableentry2 a:hover, .sectiontableentry1 a:hover, .sectiontableentry2 a.category:hover, .sectiontableentry1 a.category:hover {
color: #333333;
background: none;
}

span.pagenav {
color: #ccc;
}

table.pollstableborder td {
padding: 0;
text-align: left;
}

.pollstableborder td, .pollstableborderS2 td, pollstableborderS1 td, pollstableborderS3 td {
text-align: left;
font: 0.87em/0.92em Arial, Helvetica, sans-serif;
padding: 3px 0px 3px 5px;
vertical-align: middle;
}

/* @end */


/* @group Lower Modules Display (User4/Right) */

/* MODULEWRAP */
.left .moduletable-img, .right .moduletable-img,
.left_wide .moduletable-img, .right_wide .moduletable-img {
margin: 0px auto;
padding: 0px 0px 10px 0px;
text-align: center;
}

div.modulewrap {
width: 700px;
float: right;
margin: 0;
padding: 0;
}

div.modulewrap .left {
float: left;
margin: 10px 5px;
padding: 0;
width: 335px;
background: #fff;
}

div.modulewrap .right {
float: right;
margin: 10px 5px;
padding: 0;
width: 335px;
background: #fff;
}

div.modulewrap .left_wide {
float: left;
margin: 10px 10px;
padding: 0;
background: #fff;
}

div.modulewrap .right_wide {
margin: 10px 5px;
padding: 0px;
background: #fff;
}


/* MODULEWRAP_WIDE */

div.modulewrap_wide {
width: 946px;
margin: auto;
padding: 0;
}

div.modulewrap_wide .left_wide {
width: 946px;
float: left;
}

div.modulewrap_wide .right_wide {
width: 946px;
float: right;
}

div.modulewrap_wide .left {
float: left;
margin: 10px 4px;
padding: 0;
width: 460px;
background: #fff;
}

div.modulewrap_wide .right {
float: right;
margin: 10px 4px;
padding: 0;
width: 460px;
background: #fff;
}

.right .inside {
_float: left;
margin: 0 0 5px 0;
_margin: 0;
padding: 5px 0 5px 0;
}

.left .inside {
_float: left;
margin: 0 0 5px 0;
_margin: 0;
padding: 5px 0 5px 0;
}

div.left h3, div.right h3 {
font: bold 15px/29px "Lucida Grande", Lucida, Verdana, sans-serif;
letter-spacing: normal;
margin-bottom: 12px;
}


/* GREEN */
div.moduletablegreen .contentheading a.contentpagetitle,
div.moduletablegreen .contentheading a.contentpagetitle:visited {
color: #74AC00;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
background: url(../images/world.png) no-repeat left center;
}

div.left .moduletablegreen h3 {
background: #76a60c url(../images/left_green.png) no-repeat 0px 50%;
height: 29px;
color: #FFF;
padding-left: 30px;
}

div.right .moduletablegreen h3 {
background: #76a60c url(../images/right_green.png) no-repeat 100% 50%;
height: 29px;
color: #FFF;
padding-right: 30px;
text-align: right;
}

div.modulewrap_wide div.right_wide .moduletablegreen h3,
div.modulewrap_wide div.left_wide .moduletablegreen h3 {
background: #76a60c url(../images/left_green.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
width: 946px;
text-indent: 30px;
position: relative;
}

div.modulewrap .right_wide .moduletablegreen h3,
div.modulewrap .left_wide .moduletablegreen h3 {
background: #76a60c url(../images/left_green.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
text-indent: 30px;
width: 690px;
}
/* BLUE */
/* DEFAULT (BLUE)*/

div.moduletable a.contentpagetitle,
div.moduletable a.contentpagetitle:visited,
div.moduletableblue a.contentpagetitle,
div.moduletableblue a.contentpagetitle:visited {
color: #0093E3;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
background: url(../images/package.png) no-repeat left center;
}

div.left .moduletable h3 {
background: #007AE9 url(../images/left_blue.png) no-repeat 0px 50%;
height: 29px;
color: #FFF;
padding-left: 30px;
}
div.right .moduletable h3 {
background: #007AE9 url(../images/right_blue.png) no-repeat 100% 50%;
height: 29px;
color: #FFF;
padding-right: 30px;
text-align: right;
}

div.left .moduletableblue h3 {
background: #007AE9 url(../images/left_blue.png) no-repeat 0px 50%;
height: 29px;
color: #FFF;
padding-left: 30px;
}

div.right .moduletableblue h3 {
background: #007AE9 url(../images/right_blue.png) no-repeat 100% 50%;
height: 29px;
color: #FFF;
padding-right: 30px;
text-align: right;
}

div.modulewrap_wide div.right_wide .moduletableblue h3,
div.modulewrap_wide div.left_wide .moduletableblue h3 {
background:#007AE9 url(../images/left_blue.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
width: 946px;
text-indent: 30px;
position: relative;
}

div.modulewrap .right_wide .moduletableblue h3,
div.modulewrap .left_wide .moduletableblue h3 {
background:#007AE9 url(../images/left_blue.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
text-indent: 30px;
width: 690px;
}
/* RED */

div.moduletablered .contentheading a.contentpagetitle,
div.moduletablered .contentheading a.contentpagetitle:visited {
color: #C23F26;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
background: url(../images/world.png) no-repeat left center;
text-decoration: none;
}

div.left .moduletablered h3 {
background: #C23F26 url(../images/left_red.png) no-repeat 0px 50%;
height: 29px;
color: #FFF;
padding-left: 30px;
}

div.right .moduletablered h3 {
background: #C23F26 url(../images/right_red.png) no-repeat 100% 50%;
height: 29px;
color: #FFF;
padding-right: 30px;
text-align: right;
}

div.modulewrap_wide div.right_wide .moduletablered h3,
div.modulewrap_wide div.left_wide .moduletablered h3 {
background:#C23F26 url(../images/left_red.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
width: 946px;
text-indent: 30px;
position: relative;
}

div.modulewrap .right_wide .moduletablered h3,
div.modulewrap .left_wide .moduletablered h3 {
background:#C23F26 url(../images/left_red.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #FFF;
text-indent: 30px;
width: 690px;
}

/* GRAY */

div.moduletablegray .contentheading a.contentpagetitle,
div.moduletablegray .contentheading a.contentpagetitle:visited {
color: #333;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
background: url(../images/world.png) no-repeat left center;
}

div.left .moduletablegray h3 {
background: #CCCCCC url(../images/left_gray.png) no-repeat 0px 50%;
height: 29px;
color: #333;
padding-left: 30px;
}

div.right .moduletablegray h3 {
background: #CCCCCC url(../images/right_gray.png) no-repeat 100% 50%;
height: 29px;
color: #333;
padding-right: 30px;
text-align: right;
}

div.modulewrap_wide div.right_wide .moduletablegray h3,
div.modulewrap_wide div.left_wide .moduletablegray h3 {
background:#CCCCCC url(../images/left_gray.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #333;
width: 946px;
text-indent: 30px;
position: relative;
}


div.modulewrap .right_wide .moduletablegray h3,
div.modulewrap .left_wide .moduletablegray h3 {
background:#CCCCCC url(../images/left_gray.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #333;
text-indent: 30px;
width: 690px;
}

/* BLACK */

div.moduletableblack .contentheading a.contentpagetitle,
div.moduletableblack .contentheading a.contentpagetitle:visited {
color: #0093E3;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
background: url(../images/world.png) no-repeat left center;
}

div.left .moduletableblack h3 {
background: #000 url(../images/left_black.png) no-repeat 0px 50%;
height: 29px;
color: #CCC;
padding-left: 30px;
}

div.right .moduletableblack h3 {
background: #000 url(../images/right_black.png) no-repeat 100% 50%;
height: 29px;
color: #CCC;
padding-right: 30px;
text-align: right;
}

div.modulewrap_wide div.right_wide .moduletableblack h3,
div.modulewrap_wide div.left_wide .moduletableblack h3 {
background:#000 url(../images/left_black.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #CCC;
width: 946px;
text-indent: 30px;
position: relative;
}

div.modulewrap .right_wide .moduletableblack h3,
div.modulewrap .left_wide .moduletableblack h3 {
background:#000 url(../images/left_black.png) no-repeat 0% 50%;
height: 29px;
line-height: 29px;
color: #CCC;
text-indent: 30px;
width: 690px;
}

div.moduletablegreen .contentheading a.contentpagetitle:hover,
div.moduletableblue .contentheading a.contentpagetitle:hover,
div.moduletablered .contentheading a.contentpagetitle:hover,
div.moduletablegray .contentheading a.contentpagetitle:hover,
div.moduletableblack .contentheading a.contentpagetitle:hover,
div.moduletable a.contentpagetitle:hover
{
color: #666;
font-size: .90em;
line-height: 1.25em;
padding-left: 19px;
}

User avatar
TomT
Joomla! Ace
Joomla! Ace
Posts: 1270
Joined: Thu Aug 18, 2005 5:50 am
Location: Amsterdam
Contact:

Re: Extended Menu

Post by TomT » Thu May 01, 2008 2:29 pm

You have to look at the menu.css. The elements I mentioned aren't there. But you could add a width to ul.mainlevel-nav ul ul,
ul.mainlevel-nav ul ul ul {
display: none;
position: absolute;
top: 0;
left: 168px;
}
and to some other elements.

Do you have the webdeveloper toolbar in Firefox? If not you should install it. One of it's many options is edit css. This way you can try out changes to your css files. Another essential one is: Information> Display id- and classdetails, this way you can see which classes need to be edited. It will take some time to find out which elements need to be edited in the css, but th ewebdeveloper toolbar will make it easier.

User avatar
two5chicken
Joomla! Apprentice
Joomla! Apprentice
Posts: 24
Joined: Mon May 05, 2008 5:56 pm

Re: Extended Menu

Post by two5chicken » Mon May 05, 2008 8:10 pm

I uploaded and installed Extended Menu Module and then FTP the Son of Suckerfish template to my template folder. Now when activate the module I get this:


pat-Error Could not load module patTemplate_Reader_ (/usr/local/apache2/htdocs/libraries/pattemplate/patTemplate/Reader/.php).


What is the cause?

[UPDATE]

Nevermind, I just installed it wrong. I told to module to look in the wrong directory.
Last edited by two5chicken on Tue May 06, 2008 8:10 pm, edited 1 time in total.

revan
Joomla! Fledgling
Joomla! Fledgling
Posts: 1
Joined: Wed Nov 29, 2006 10:32 am

Re: Extended Menu

Post by revan » Tue May 06, 2008 11:30 am

Hello de,

I'm using extended menu, with the son-of-suckerfish vertical template, and I'm having some trouble with menus that have more than 3 depth levels.

Till 3rd level there is no problem, the subitems are only shown when mouse over but if theres a subitem that has 4th level items they are automatically shown when mouse is over 2nd level.

For better understanding, I'm including a picture showing what happens when the mouse is over the item signed by the dark arrow.

Notice that the subitems from "formação avançada" and "novidades formação" appear without passing the mousse over this options.

How can I fix this?

Best Regards

Image

babberoo
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 139
Joined: Wed Jan 23, 2008 5:35 pm

Auto Expand Multiple Sections

Post by babberoo » Mon May 12, 2008 10:16 am

I want to have multiple sections/categories that I wish to auto expand using Ext Menu(1.0.5) and Joomla 1.5.3. Unfortunately if I set it to auto expand, I get nothing so I have set it up as follows:

I have a parent item (simple content page) which when clicked I want to show the 6 or so sections I have. I have the following settings:

Source Type: Sections
Source Value: 1,2,3,4,5,6,7
Show Section: Table Section
Show Category: Table Section
Show Content Item: Content Item Link

Menu Style: Tree

This gives me the required menu structure, but instead of linking to a Section Table, or Category table, it links to a single Content Item. How can I set this up to auto expand the sections/cats as required?

karenn1
Joomla! Apprentice
Joomla! Apprentice
Posts: 9
Joined: Fri Mar 07, 2008 8:33 am

Re: Extended Menu

Post by karenn1 » Wed May 14, 2008 3:15 pm

Hi there!

I'm using Extended Menu on the Aqualine template from JoomlaShack using Joomla 1.0. It all works fine. The only problem I'm having is when you rollover the menu (expading two levels down) and roll away, returning to that menu it displays blank entries for the sub items. To explain better, here's an image:

What it should look like:

Image

What it does when you come back after rolling over it:

Image



Any help would be appreciated!

Thanks!
Karen

User avatar
midwestkel
Joomla! Explorer
Joomla! Explorer
Posts: 367
Joined: Fri Apr 14, 2006 11:52 pm
Location: Colorado Springs, CO
Contact:

Re: Extended Menu

Post by midwestkel » Tue May 20, 2008 4:36 am

Has anyone solved this problem below? I am having the same issue.
revan wrote:Hello de,

I'm using extended menu, with the son-of-suckerfish vertical template, and I'm having some trouble with menus that have more than 3 depth levels.

Till 3rd level there is no problem, the subitems are only shown when mouse over but if theres a subitem that has 4th level items they are automatically shown when mouse is over 2nd level.

For better understanding, I'm including a picture showing what happens when the mouse is over the item signed by the dark arrow.

Notice that the subitems from "formação avançada" and "novidades formação" appear without passing the mousse over this options.

How can I fix this?

Best Regards

Image
Kelly Karnetsky - I make websites for various reasons
█ I run a nifty game, entertainment & tech site http://flesheatingzipper.com

triffen
Joomla! Apprentice
Joomla! Apprentice
Posts: 8
Joined: Fri Aug 10, 2007 9:39 pm

Re: Extended Menu

Post by triffen » Wed May 21, 2008 6:55 pm

I am working in Joomla 1.5 and have an issue with the Extended Menu system. It seems that I am able to create a third level, but unfortunately it does not appear in the menu. When I mouse-over the menu, the second level arrows show up, but the arrows signaling the third level do not show up, nor do the actual third level menus.

I am using fayen template from pixelsparadise, and have joomla 1.5 running on legacy mode.

I believe I have installed correctly (activated and copied over the CSS to the appropriate place), but am unable to make this appear.

Any ideas would be beneficial.

Thank you.

 

Locked

Return to “Open Source Products for Joomla!”