Submenu Dropdown

Everything to do with Joomla! 1.5 templates and templating.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Locked
techden
Joomla! Apprentice
Joomla! Apprentice
Posts: 36
Joined: Wed Dec 23, 2009 12:46 am

Submenu Dropdown

Post by techden » Sat Jan 09, 2010 4:18 pm

I am using the milky way template with a horiz menu in the user3 position. I want to create a submenu when when you hover over the parent item the submenu appears like a dropdown below it. I added the submenu items under the parent item I desire. When I preview it the submenu appears "in-line" with the rest of the menu items (not appearing as a dropdown). Any ideas on how to make this work?

Thanks in advance.

stereooptics
Joomla! Fledgling
Joomla! Fledgling
Posts: 2
Joined: Thu Dec 17, 2009 4:17 am

Re: Submenu Dropdown

Post by stereooptics » Sun Jan 10, 2010 2:01 am

techden,

I've been searching this forum for the same exact thing and can't find anything that doesn't look like a CSS headache.

wanted: a milkyway user3 menu that displays a vertical submenu as a dropdown during a hover

anybody?

globalcpe
Joomla! Fledgling
Joomla! Fledgling
Posts: 1
Joined: Fri Jun 25, 2010 1:10 am

Re: Submenu Dropdown

Post by globalcpe » Fri Jun 25, 2010 4:06 pm

You need to go to:
Extensions >> Module Manager >> your menu >> Parameters >> Module Parameters

Then select:
Always show sub-menu Items / to yes.

imurphster
Joomla! Apprentice
Joomla! Apprentice
Posts: 18
Joined: Tue Sep 30, 2008 7:27 pm

Re: Submenu Dropdown

Post by imurphster » Mon Jun 28, 2010 5:36 pm

I have managed to show all sub menus, however i only wanted to see the sub menu when i hovered over the menu, (like it does in the backend of joomla) does anyone know how to do this?

Regards

Ian

ranwaldo
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Sun Sep 05, 2010 11:51 am

Re: Submenu Dropdown

Post by ranwaldo » Sat Sep 25, 2010 5:05 pm

I am trying to do the same thing. I have the dropdown working, but the hover is not working on the submenu items. Any suggestions would be appreciated.

I am using a derivative off the beez template and I have added the following code to 'layout.css':

Code: Select all

/* --------------------------------------------------------------------- */
/* Testing: this almost works.                                       .   */
/* --------------------------------------------------------------------- */
#header ul li {
  position: relative;
}
#header ul li ul {
  display: none;
  background: #000;
//z-index:0;
}
#header ul li:hover ul {  /* add ", #header ul li ul" is just for testing */
  display: block;
  list-style:none;
  position: absolute;
  left: 0px;
  top: 21px;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}
#header ul li ul li {
}
#header ul li ul li a {
  float:left;
  width:100px;
  text-align: left;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}
#header ul li ul li a:hover, #header ul ul li li a:active, #header ul li ul li a:focus {
background:none repeat scroll 0 0 #ccc;
color:#000000;
font-weight:bold;
}
#header ul li ul li a:link, #header ul li ul li a:visited {
background:none repeat scroll 0 0 #ccc;
border-left: 1px solid #666666;
border-right: 1px solid #666666;
border-bottom: 1px solid #666666;
color:#000;
font-weight:normal;
line-height:1.0em;
padding:5px 5px;
text-decoration:none;
}
/* ---------------------------------------------------------------------*/

User avatar
imanickam
Joomla! Master
Joomla! Master
Posts: 28192
Joined: Wed Aug 13, 2008 2:57 am
Location: Chennai, India

Re: Submenu Dropdown

Post by imanickam » Sat Sep 25, 2010 5:19 pm

Probably you could also review the document http://docs.joomla.org/Creating_a_CSS_Drop_down_Menu that could be of help.
Ilagnayeru (MIG) Manickam | இளஞாயிறு மாணிக்கம்
Joomla! - Global Moderators Team | Joomla! Core - Tamil (தமிழ்) Translation Team Coordinator
Former Joomla! Translations Coordination Team Lead
Eegan - Support the poor and underprivileged

ranwaldo
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Sun Sep 05, 2010 11:51 am

Re: Submenu Dropdown

Post by ranwaldo » Mon Sep 27, 2010 12:19 pm

Problem solved. It was a z-index issue. The following code fixed it.

Code: Select all

#header ul li ul li {
  z-index: 99;
}
To recap, just add the following code to layout.css and voila, you have dropdown menus.

Code: Select all

/* --------------------------------------------------------------------- */
/* Make horizontal submenus render as dropdowns.  ~ranwaldo              */
/* --------------------------------------------------------------------- */
#header ul li {
  position: relative;
}
#header ul li ul {
  display: none;
  background: #000;
}
#header ul li:hover ul {  /* add ", #header ul li ul" is just for testing */
  display: block;
  list-style:none;
  position: absolute;
  left: 0px;
  top: 21px;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}
#header ul li ul li {
  z-index: 99;
}
#header ul li ul li a {
  float:left;
  width:100px;
  text-align: left;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}
#header ul li ul li a:hover, #header ul ul li li a:active, #header ul li ul li a:focus {
  background:none repeat scroll 0 0 #ccc;
  color:#000000;
  font-weight:bold;
}
#header ul li ul li a:link, #header ul li ul li a:visited {
  background:none repeat scroll 0 0 #ccc;
  border-left: 1px solid #666666;
  border-right: 1px solid #666666;
  border-bottom: 1px solid #666666;
  color:#000;
  font-weight:normal;
  line-height:1.0em;
  padding:5px 5px;
  text-decoration:none;
}
#header ul li ul li a:hover {
  background:none repeat scroll 0 0 #fff;
}
/* ---------------------------------------------------------------------*/

ranwaldo
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Sun Sep 05, 2010 11:51 am

Re: Submenu Dropdown

Post by ranwaldo » Mon Sep 27, 2010 5:37 pm

Just to completely describe the usage of the above code, you must also:
1. Set "Module Manager" >> Menu >> "Menu Style" = List
2. Set "Module Manager" >> Menu >> "Always show sub-menu Items" = yes

~ranwaldo

ayeseadewale
Joomla! Fledgling
Joomla! Fledgling
Posts: 1
Joined: Tue Feb 21, 2012 5:23 am

Re: Submenu Dropdown

Post by ayeseadewale » Tue Feb 21, 2012 5:37 am

I am still having promlem with dropdown menu, itried the code but i dnt word.Where are we to past the code? is it at the eldge of the page, middle or beginning of the page. Please i need an urgent help regarding to it. Here is my website www.educaremgt.org

I also need an application or moule which when my visitors input their bank depost teller number will allow them to fill a particular form.
Please help me!!!!!!!!!!!!!!!!!!


Locked

Return to “Templates for Joomla! 1.5”