Hi,

I am new to drupal. i am learning the drupal now and trying to bulid a demo site using drupal.

I develop the horizontal menu using superfish module with single submenu. I implemented the superfish module as a block in the header region. Now i need to implement the main menu images instead of text. While hover the main menu also, i need to call the hover images in the main menu region.

When i try to work with css, by making the main menu text ID to "display:none", links also getting hiding.

Please help me on this issue to solve id.

Note: I attached my main menu and reference main menu.

My css code
#superfish-1 li a { font-family:Verdana, Arial, Helvetica, sans-serif; color:#fefefe; font-size:13px; line-height:39px; margin-left:19px; margin-right:17px; text-decoration:none;}
/*#menu-198-1 a {background-image:url(../images/home.jpg); width:300px; height:100px;}*/
#superfish-1 li ul {width: 217px !important; }
#superfish-1 li ul li {background:#ffffff; border:1px solid #fbebdc; font-family:Verdana, Arial, Helvetica, sans-serif; color:#000000; font-size:12px; line-height:21px; left: -47px; top: 14px;}
#superfish-1 li ul li a {font-family:Verdana, Arial, Helvetica, sans-serif; color:#000000; font-size:12px; line-height:21px; text-decoration:none; text-align:center; }
#superfish-1 li ul li a:hover {color:#9a6b28;}
#menu-413-1 ul li { left: -54px !important;}
#menu-414-1 ul li { left: -60px !important;}

CommentFileSizeAuthor
Need to implment like.PNG21.09 KBRajguru25
Drupal superfish main menu.png2.71 KBRajguru25

Comments

mehrpadin’s picture

mehrpadin commented
Status: Active » Fixed

For the record:

#superfish .sf-menu li.sf-depth-1 a.sf-depth-1 {
  overflow: hidden;
  line-height: 9999px;
  text-indent: -9999px;
  width: 100px;
  height: 30px;
  background: url('image.jpg') no-repeat left center;
}

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.