login  Naam:   Wachtwoord: 
Registreer je!
 Forum

CSS menu hover

Offline DrB - 07/09/2007 19:36 (laatste wijziging 07/09/2007 19:40)
Avatar van DrBHTML interesse Ik zit weer met een CSS vraagje. Ik heb de volgende CSS voor mijn menu:

  1. #submenu ul, #submenu ul li {
  2. float:left;
  3. list-style-type: none;
  4. display: inline;
  5. padding: 0;
  6. margin: 0;
  7. border: 0;
  8. }



Ik maak het menu als volgt aan:

  1. <div id="submenu">
  2. <ul>
  3. <li class="home"><a href="index.html"><img src="img/home.gif" alt="" border="0"/></a></li>
  4. <li class="cv"><img src="img/cv.gif" alt="" /></li>
  5. <li><img src="img/interview.gif" alt="" /></li>
  6. <li><img src="img/overige.gif" alt="" /></li>
  7. <li><img src="img/links.gif" alt="" /></li>
  8. <li><img src="img/contact.gif" alt="" /></li>
  9. </ul>
  10. </div>



Nu wil ik een Hover element plaatsen. Dus als men over de home button gaat wil ik home2.gif in beeld zien. Ik heb al verschillende pogingen gedaan, maar zal ze niet allemaal hier neerzetten, anders wordt het een groot bericht 

Ik kan het wel oplossen met javascript, maar wil het netjes met CSS oplossen.

2 antwoorden

Gesponsorde links
Offline Koen - 07/09/2007 19:38
Avatar van Koen PHP expert Kan je dan niet beter met javascript werken?
Offline DrB - 07/09/2007 19:41 (laatste wijziging 07/09/2007 19:46)
Avatar van DrB HTML interesse Nee 

Dit werkt wel voor gewone divjes, maar ik weet niet hoe ik het moet samenvoegen met een li

  1. #home a {
  2. display: block;
  3. width :154px;
  4. height:27px;
  5. }
  6.  
  7. #home:hover {
  8. display: block;
  9. width :153px;
  10. height:27px;
  11. background-image:url(../img/home2.gif);
  12. }


dan zal het iets worden van:

  1. #submenu ul home:hover{
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.2s