A Suckerfish Menu Issue
Posted: 06 November 2009 03:56 AM   [ Ignore ]
Newbie
Rank
Total Posts:  2
Joined  2009-11-06

I have a drupal site I am working on, and the theme I am using has suckerfish dropdowns, but only one level of them. I am not very savvy with suckerfish, but I managed to create the second level of dropdown that I was trying to add.

The only problem is, I want this second level to fly out to the right, but cannot for the life of me get it to budge AT ALL from the current position.

The site is here: http://www.slabinskifuneralhome.com.php5-7.dfw1-1.websitetestlink.com/

The only second level item I have currently is SERVICE OPTIONS>CREMATION SERVICES>CREMATION AUTHORIZATION

The CSS for the suckerfish menus is below (specifically look at the section that says SECOND-LEVEL DROPDOWN ATTEMPT). If anyone can spot what I need to change here, it would be much appreciated.

/* Primary Links */

#primary-links h2 {
  
display:none;
}

#primary-links {
  
border-bottom3px solid #000000;
}

#primary-links, #primary-links ul {
  
padding0;
  
margin0;
  
line-height28px;
  list-
stylenone;
  
border-leftsolid 1px #910000;
  /*border-right: solid 1px #D18A44;*/
  
backgroundurl(images/primary-bg2.pngrepeat-x;
}

/*#primary-links div#block-menu-primary-links div.content ul {
  width: 840px;
  margin: 0 auto;
}*/

#primary-links div#block-menu-primary-links div.content ul li ul{
  
width208px;
  
margin-left: -11px;
}

#primary-links a {
  
displayblock;
  
padding0 11px 2px 0;
  
/*font-weight: bold;*/
  
font-size15px;
  
color#ffffff;
  
font-weightbold;
  
font-family"Times New Roman"Timesserif;
  
text-decorationnone;
  
/*background: url(images/primary-hover-r.png) right top no-repeat;*/
}

#primary-links li {
  
floatleft;
  list-
stylenone;
  
padding0 0 0 10px;
  
margin0;
  
border-rightsolid #910000 1px;
  /*background: url(images/primary-hover-l.png) left top no-repeat;*/
}

#primary-links li ul li {
  
border-rightnone;
  
border-bottomsolid #999999 1px;
}

#primary-links li:hover a {
  
color#ffffff;
  /*background: url(images/primary-r.png) right top no-repeat;*/
}

#primary-links a:hover {
  
color#ffffff;
}

#primary-links li:hover {
  
backgroundurl(images/primary-bg-active.pngrepeat-x;
}

#primary-links li:hover li a, #primary-links li:hover li {
  
color#171c23;
  
backgroundnone;
}

#primary-links li ul {
  
margin-left: -10px;
  
positionabsolute;
  
width210px;
  
left: -999em;
  
border3px solid #999999;
  /*background: #aebfd8;*/
  
backgroundurl(images/marble_menuback.jpg);
  
z-index1000;
}

#primary-links li:hover ul, #primary-links li.sfhover ul {
  
leftauto;
}

#primary-links li ul li a, #primary-links li ul li {
  
padding0 0 0 4px;
  
margin0;
  
width200px;
  
font-size12px;
  
font-weightbold;
  
line-height20px;
  
backgroundnone;
}

#primary-links li ul li {
  
width204px;
  
padding-bottom2px;
}

#primary-links li ul li a:hover, #primary-links li ul li:hover {
  
color#ffffff;
  
background#3b475a;
}

#primary-links li:hover ul ul, #primary-links li.sfhover ul ul {
  
left: -999em;
}

/* SECOND LEVEL DROPDOWN ATTEMPT */

#primary-links li ul li ul{
  
padding0;
  
line-height28px;
  list-
stylenone;
  
border-leftsolid 1px #910000;
  /*border-right: solid 1px #D18A44;*/
  /*background: url(images/primary-bg2.png) repeat-x;*/
}

/*#primary-links div#block-menu-primary-links div.content ul li ul{
  width: 208px;
  margin-left: -11px;
}*/

#primary-links li ul li ul li{
  
border-rightnone;
  
border-bottomsolid #999999 1px;
}

#primary-links li ul li:hover {
  /*background: url(images/primary-bg-active.png) repeat-x;*/
}

#primary-links li ul li:hover li a, #primary-links li ul li:hover li {
  
color#171c23;
  
backgroundnone;
}

#primary-links li ul li ul {
  
margin-left: -10px;
  
positionabsolute;
  
width210px;
  
left: -999em;
  
border3px solid #999999;
  /*background: #aebfd8;*/
  
backgroundurl(images/marble_menuback.jpg);
  
z-index1002;
}

#primary-links li ul li:hover ul, #primary-links li ul li.sfhover ul {
  
leftauto;
}

#primary-links li ul li ul li a, #primary-links li ul li ul li {
  
padding0 0 0 4px;
  
margin0;
  
width200px;
  
font-size12px;
  
font-weightbold;
  
line-height20px;
  
backgroundnone;
}

#primary-links li ul li ul li {
  
width204px;
  
padding-bottom2px;
}

#primary-links li ul li ul li a:hover, #primary-links li ul li ul li:hover {
  
color#ffffff;
  
background#3b475a;
}

#primary-links li ul li:hover ul ul, #primary-links li ul li.sfhover ul ul {
  
left: -999em;
}
/* END */ 
Profile
 
 
Posted: 06 November 2009 07:03 PM   [ Ignore ]   [ # 1 ]
Newbie
Rank
Total Posts:  2
Joined  2009-11-06

Thanks anyway.  I got help elsewhere on this.  But just FYI, all that needed to be done was too change:

#primary-links li ul li:hover ul, #primary-links li ul li.sfhover ul {
left: auto;
}

to:

#primary-links li ul li:hover ul, #primary-links li ul li.sfhover ul {
left: 220px;
margin-top: -20px;
}


Chris

Profile
 
 
Posted: 10 November 2009 08:35 PM   [ Ignore ]   [ # 2 ]
Newbie
Rank
Total Posts:  4
Joined  2009-11-10

why not use son of suckerfish? it is and improved version of suckerfish?
I use suckerfish in a lot of my project, really easy to use
—————————————————————————————————-
forum 22

Profile