float, innerHTML et Mozilla - HTML/CSS - Programmation
Marsh Posté le 12-06-2003 à 21:56:34
Argh ce code
Marsh Posté le 12-06-2003 à 22:16:39
gm_superstar a écrit : Argh ce code |
Mr a des ameliorations a apporter ?
je suis toute ouie (vu ton cri, y a du boulot je presume)
Marsh Posté le 12-06-2003 à 22:45:27
Heu... j'avoue ne pas trop savoir par où commencer :
- vérifie ton code au validateur
- crée des fonctions JavaScript pour ne pas avoir tout le code dans les onmouseover (ça c'est franchement illisible)
- crée des classes pour remplacer les styles en-ligne
Marsh Posté le 12-06-2003 à 23:40:14
- vérifie ton code au validateur
j'ose pas, j'ai jamais osé
- crée des fonctions JavaScript pour ne pas avoir tout le code dans les onmouseover (ça c'est franchement illisible)
c'etait deja fait ( http://81.56.83.34/ )
- crée des classes pour remplacer les styles en-ligne
je comprends pas tres bien...ça va apporter koi les classes ?
Marsh Posté le 12-06-2003 à 23:51:51
thesmilingface a écrit : j'ose pas, j'ai jamais osé |
Mais si, faut pas avoir peur. C'est peut être un peu dur la première fois mais après on s'habitue
thesmilingface a écrit : c'etait deja fait ( http://81.56.83.34/ ) |
Bon c'est déjà mieux, mais tu as fait autant de fonctions que de texte à changer. C'est lourd. Tu devrais mettre le texte dans un tableau JS et puis ensuite, à l'aide d'une seule fonction, placer dans innerHTML l'extrait du tableau qui va bien.
thesmilingface a écrit : |
Plus de lisibilité et plus de modularité. Au lieu d'avoir 50 fois :
style="padding-left:50px;" |
Tu redéfinis les propriété pour l'élément <p> (si tous tes paragraphes partagent cette propriété)
p { |
Ou sinon tu crées des classes. Au lieu de :
<p style="padding-top:5px;padding-left:40px;padding-right:40px;padding-bottom:0px;">... |
on a :
<p class="images">... |
Marsh Posté le 13-06-2003 à 00:05:47
j'ai 11740740974 erreurs, rien de grave, W3C compliant
le soucis c que le code Php n'est pas de moi, et l'html qui en resulte est loin d'etre W3C compliant
pour mes nombreuses fonctions, j'y ai pensé, mais je veux pas faire remonter mon texte dans les p ou img, reste plus qu'a passer un nombre ou un court texte en parametre d'une fonction...
les class , c pour les <p> !!! je comprends mieux, je voyais pas de koi tu parlais...bin, on peut les classifier meme si j'ai pas l'impression qu'on gagnera en lisibilité (tant que je ne l'utilise que sur une page...)
Note: ceci ne me fournit toujours aucune solution face a mon probleme d'origine (ouep, j'etais un peu venu pour lui au depart )
Marsh Posté le 13-06-2003 à 00:44:59
thesmilingface a écrit : j'ai 11740740974 erreurs, rien de grave, W3C compliant |
Tu peux déjà commencer à corriger ta partie à toi
thesmilingface a écrit : pour mes nombreuses fonctions, j'y ai pensé, mais je veux pas faire remonter mon texte dans les p ou img, reste plus qu'a passer un nombre ou un court texte en parametre d'une fonction... |
Oui, c'est ce que je disais
thesmilingface a écrit : les class , c pour les <p> !!! je comprends mieux, je voyais pas de koi tu parlais...bin, on peut les classifier meme si j'ai pas l'impression qu'on gagnera en lisibilité (tant que je ne l'utilise que sur une page...) |
L'attribut style c'est bien pour dépanner, mais le jour où tu voudras faire des modification ça sera lourd Et pour un lecteur comme (chiant donc) c'est beaucoup plus agréable à lire avec CSS et HTML séparé.
thesmilingface a écrit : Note: ceci ne me fournit toujours aucune solution face a mon probleme d'origine (ouep, j'etais un peu venu pour lui au depart ) |
Bah, en fait tu n'as pas besoin de mettre #menuMain en flottant. Il suffit de le définir avec une bonne marge à gauche :
div#menuMain { |
Ça devrait mieux marcher
Marsh Posté le 12-06-2003 à 21:46:37
je vous soumets mon probleme:
http://thesmilingface.free.fr/
sous mozilla 1.2
j'ecris un commentaire que je modifie au survol de quelques liens,
ou que je remplace par une image.
lors du deuxieme emploi de innerHTML, toute la page se decale vers le bas
si j'ote la declaration ->float: right;<- ça bug plus, mais le texte est pas au bon endroit ( logique )
onmouseover ou onmouseout:
document.getElementById('menuMain').innerHTML='mon texte';
les styles:
div#menus {
width: 100%;
margin-left: auto;
margin-right: auto;
}
div#menuLeft {
float: left;
width: 49%;
}
div#menuMain {
float: right;
width: 49%;
}
div#dedicaces {
padding: 10px;
BORDER-TOP: #a0a0a0 1px solid;
BORDER-LEFT: #a0a0a0 1px solid;
BORDER-RIGHT: #000000 5px solid;
BORDER-BOTTOM: #000000 5px solid;
}
div#menuMainLiens {
padding: 10px;
BORDER-TOP: #a0a0a0 1px solid;
BORDER-LEFT: #a0a0a0 1px solid;
BORDER-RIGHT: #000000 5px solid;
BORDER-BOTTOM: #000000 5px solid;
}