Tom's Guide > Forum > Programmation > erreur dans le html ou dans le css ? [RESOLU]

erreur dans le html ou dans le css ? [RESOLU]

Forum Programmation : erreur dans le html ou dans le css ? [RESOLU]

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !
Créer un nouveau sujet Répondre
Mot :    Pseudo :           
 
newblux   28-04-2008 à 23:01:02

Bonjour a tous!!
j'ai honteusement plagier un menu html dans linux pratique n 41 pour ne pas le citer mais ça ne marche pas...
le but est d'avoir un menu fait de 5 boules noires et blanches
et qui se colorent lorsqu'on passe la souris dessus.

mon html :

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  3.   <head>
  4.       <title>colored</title>
  5.       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6.       <link rel="stylesheet" media="screen" type="text/css" title="Design" href="sheap.css" />
  8.   </head>
  9.   <body>
  10.   <ul id="menu">
  11.               <li id="menu1"><a href="#"></a></li>
  12.               <li id="menu2"><a href="#"></a></li>
  13.               <li id="menu3"><a href="#"></a></li>
  14.               <li id="menu4"><a href="#"></a></li>
  15.               <li id="menu5"><a href="#"></a></li>
  16.   </ul>
  17.   </body>
  18. </html>



mon css:

Code :
  1. #menu {
  2. position: relative;
  3. width: 500px;
  4. height: 400px;
  5. margin: 10px auto;
  6. padding: 0;
  7. background: url(gray.png);
  8. }
  10. #menu li {
  11. position: absolute;
  12. margin: 0;
  13. padding: 0;
  14. list-style: none;
  15. }
  17. #menu a {
  18. display: block;
  19. }
  21. #menu1 {left: 66px; top: 103px; width: 269px; height: 128px;}
  22. #menu2 {left: 170px; top: 25px; width: 273px; height: 132px;}
  23. #menu3 {left: 331px; top: 116px; width: 434px; height: 220px;}
  24. #menu4 {left: 212px; top: 243px; width: 324px; height: 352px;}
  25. #menu5 {left: 69px; top: 238px; width: 136px; height: 304px;}
  27. #menu1 a {height: 128px;}
  28. #menu2 a {height: 132px;}
  29. #menu3 a {height: 220px;}
  30. #menu4 a {height: 352px;}
  31. #menu5 a {height: 304px;}
  33. #menu1 a:hover {background: url(color.png) -66px 103px no-repeat;}
  34. #menu2 a:hover {background: url(color.png) -170px 25px no-repeat;}
  35. #menu3 a:hover {background: url(color.png) -331px 116px no-repeat;}
  36. #menu4 a:hover {background: url(color.png) -212px 243px no-repeat;}
  37. #menu5 a:hover {background: url(color.png) -69px 238px no-repeat;}




et les deux images nécésaires :
http://membres.lycos.fr/phemtolazer/color.png

http://membres.lycos.fr/phemtolazer/gray.png

Quelqu'un a la solution ?


Message édité par newblux le 29-04-2008 à 15:28:22
Répondre
Liens sponsorisés
Inscrivez-vous ou connectez-vous pour masquer ceci.
newblux   29-04-2008 à 09:59:00
- 0 +

mushi mushi ?
Y'a quelqu'un ?
"ohohooooo"
--echo--
"ohohooooo"
bon faudrais que jpense a m'arrété la..

Répondre à newblux
jerbe   29-04-2008 à 12:32:59
- 0 +

pourquoi n'utilise tu pas tout simplement onmouseover et onmouseout ?

Répondre à jerbe
newblux   29-04-2008 à 12:40:17
- 0 +

euh je sais pas lol
je ne m'y connais pas très bien..
c'est quoi la difference ?
dans mon mag c'étais comme ça :$ xD
mais je suis ouvert a tte les suggestions..


Message édité par newblux le 29-04-2008 à 12:42:26
Répondre à newblux
jerbe   29-04-2008 à 15:11:59
- 0 +

Si j'ai bien compris tu veux faire ça :

 
Code :
  1. <img src="http://membres.lycos.fr/phemtolazer/gray.png" id=menu onmouseover="this.src='http://membres.lycos.fr/phemtolazer/color.png'" onmouseout="this.src='http://membres.lycos.fr/phemtolazer/gray.png'" alt=menu_img>
 

remplacer l'image lors du survol de la sourie.


Message édité par jerbe le 29-04-2008 à 15:13:55
------------------------------ Venez jouer sur mon site : http://www.gugusland.com
mes autres sites : http://jeremy1000.free.fr > http://jybforum.free.fr
 Répondre à jerbe
newblux   29-04-2008 à 15:27:39
- 0 +

remplacé l'image de chaque boule
pour que chaque boule soit un lien

j'ai trouver
le bon code est

:

#menu {
position: relative;
width: 500px;
height: 400px;
margin: 10px auto;
padding: 0;
background: url(gray.png);
}

#menu li {
position: absolute;
margin: 0;
padding: 0;
list-style: none;
}

#menu a {
display: block;
}

#menu1 {left: 84px; top: 118px; width: 80px; height: 80px;}
#menu2 {left: 170px; top: 25px; width: 110px; height: 105px;}
#menu3 {left: 331px; top: 116px; width: 105px; height: 110px;}
#menu4 {left: 212px; top: 243px; width: 115px; height: 110px;}
#menu5 {left: 69px; top: 238px; width: 75px; height: 68px;}

#menu1 a {height: 80px;}
#menu2 a {height: 105px;}
#menu3 a {height: 110px;}
#menu4 a {height: 110px;}
#menu5 a {height: 68px;}

#menu1 a:hover {background: url(color.png)-84px -118px no-repeat;}
#menu2 a:hover {background: url(color.png)-170px -25px no-repeat;}
#menu3 a:hover {background: url(color.png)-331px -116px no-repeat;}
#menu4 a:hover {background: url(color.png)-212px -243px no-repeat;}
#menu5 a:hover {background: url(color.png)-69px -238px no-repeat ;}

Répondre à newblux
jerbe   29-04-2008 à 17:08:33
- 0 +

aaaa, d'accord, j'avais pas compris ce que tu voulais faire, dsl.

Répondre à jerbe
Créer un nouveau sujet Répondre
Tom's Guide > Forum > Programmation > erreur dans le html ou dans le css ? [RESOLU]
Aller à :

Il y a 2759 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Plan du forum
Forum Bestofmedia ©
2000-2009 Bestofmedia Group
Page générée en 0,293 secondes
Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler
Liens