28172 sujets

CSS et mise en forme, CSS3

[RESOLU] Norme w3c et onMouseOver

Bonjour,

Tout est dans le titre,
Ce qui me géne d'abandonner les "onMouseOver" c' est de perdre la vitesse
due au préchargement que j'ais toujours dans mes javascript ...
quand la souris passe sur une ressource, de ce type l'effet est immédiat.

De plus j'en ais un peut partout dans mes sites web ...

Est'il possible de préserver cela ?
Modifié par FoxLeRenard (20 Mar 2009 - 23:35)
Salut,

Abandonner les onmouseover au profit de quoi ? Comment peut-on te répondre correctement si on a la moitié de l'énoncé ?
Agylus a écrit :
Salut,

Abandonner les onmouseover au profit de quoi ? Comment peut-on te répondre correctement si on a la moitié de l'énoncé ?

Houps tu as raison, j'étais tellement dans mon idée que j'ais oublié le principal .. Smiley confused

Bien sur onmouseover sur des images de liens par rapport a la solution CSS


.xxx {
  background: white url(img/ss1.png) left top no-repeat;
  }

.xxx:hover {
  background-image: url(img/ss2.png);
}
Dans ce cas oui, en utilisant une seule image, que l'on fera coulisser (voire technique des portes coulissantes)
Il te suffit de faire une seule image avec les deux états et de modifier le positionnement du background. Tu n'as qu'une seule image à charger comme ça, et elle est automatiquement chargée à l'affichage du premier état.
Modérateur
Bonjour,

Les événements Javascript sont tout à fait valides. Si tu veux modifier une image par une autre au passage de la souris, je recommande fortement de le faire en Javascript. C'est précisément le rôle de Javascript de le faire. L'important est d'externaliser au possible le code Javascript.

Dans quel contexte veux-tu modifier une image par une autre? Est-ce un menu de navigation? Un exemple en ligne serait utile pour mieux te conseiller.
Modifié par Tony Monast (19 Mar 2009 - 15:10)
Salut,

Au passage si le but est d'externaliser le javascript et que tu utiliser prototype, tu peux utiliser la fonction Event.observer, qui va surveiller les actions sur un élément...
Whaou merci a
Laurie-Anne Agylus Tony Monast Mikerob Smiley hippy

Ok 100% pour l'image double , car la elle est préchargée Smiley biggrin ... mais alors dans toutes mes pages il me faut les mettres dans un conteneur .. pour faire positionner l'image , vraiment pourquoi le validateur n'acceptes pas mon onmouseover Smiley eek

Partie du javascript



var LimgLH = new Image;LimgLH.src = 'zzz/fia.gif';
var LimgLH2 = new Image;LimgLH2.src = 'zzz/fi.gif';


Partie du html généré par mon PHP



<a href="finance.php" onMouseOver="Lhome.src=LimgLH.src"  
 onMouseOut="Lhome.src=LimgLH2.src">
<img src="zzz/fi.gif" id="Lhome" alt="Retour"  /></a>

Modifié par FoxLeRenard (19 Mar 2009 - 20:18)
Modérateur
Bonjour,

Essaye onmouseover, tout en minuscule. Les attributs doivent toujours être en lettres minuscules Smiley cligne

Il serait aussi préférable d'externaliser le Javascript. Au chargement de la page, une fonction Javascript ira attacher chaque événement (onclick, onmouseover, onmouseout) aux différents éléments, au lieu d'écrire directement les événements en HTML.
Modifié par Tony Monast (19 Mar 2009 - 20:27)
Tony Monast a écrit :
Bonjour,


Merci a toi ...

a écrit :
Essaye onmouseover, tout en minuscule. Les attributs doivent toujours être en lettres minuscules


Oui j'ais tout essayé et repassé au validateur
1) minuscule
2) avec ' ou "
3) avec ="javascript:etc...
Bref pas bon tout ça alors que onclic = IMPECABLE !!


a écrit :
Il serait aussi préférable d'externaliser le Javascript. Au chargement de la page, une fonction Javascript ira attacher chaque événement (onclick, onmouseover, onmouseout) aux différents éléments, au lieu d'écrire directement les événements en HTML.


Oui passer un paramétre en appelant une fonction, mais quand dans une page tu as 60 images en liens tu vois le travail ! Smiley langue
Modérateur
Bon alors, pour arriver à trouver le problème de validation, il faudra nous montrer le code impliqué et/ou une page en ligne.

Pour le contexte dans lequel tu as des images à remplacer au survol, ce serait bien que tu nous en dise plus. Il existe peut-être une solution efficace, facile à gérer et externalisée.
Tony Monast a écrit :

Il serait aussi préférable d'externaliser le Javascript. Au chargement de la page, une fonction Javascript ira attacher chaque événement (onclick, onmouseover, onmouseout) aux différents éléments, au lieu d'écrire directement les événements en HTML.


C'est à dire, tu peux en dire plus ?
Modérateur
FoxLeRenard,

Tu dois commencer par mettre les événements en lettres minuscules. En XHTML Strict, les balises et attributs doivent être en minuscules. Une fois que ce sera fait, dis-le, je retournerai voir.

Ceci dit, je n'arrive pas à utiliser le validateur W3C avec ton site. J'obtiens un 400 Bad Request. Étrange.

Merci de m'avoir prévenu, mais j'ai quand même été terrorisé par le code. Smiley biggol Non je blague, mais je crois que ça ferait du bien de donner quelques coups de pelle dans le code. Le validateur W3C fonctionne de ton côté? Je ne sais pas ce qui ne va pas... Smiley ohwell
Tony Monast a écrit :
FoxLeRenard,
Le validateur W3C fonctionne de ton côté? Je ne sais pas ce qui ne va pas... Smiley ohwell


Laurie-Anne m'a indiqué que l'onglet validate by input sert dans ces cas la !
alors tu fais un afficher source de mon site, puis un copier/collé dans cet onglet et c'est bon !

Je crois que tout est en minuscule ! Smiley confused 
&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;



&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;


... Smiley eek


Et les erreurs de validation sont assez explicites je pense, non ?

a écrit :
Je crois que tout est en minuscule !

Et pourtant, non.
Agylus a écrit :

Et les erreurs de validation sont assez explicites je pense, non ?
Je crois que tout est en minuscule !

Et pourtant, non.

pour moi tout est maintenant en minuscule, les espaces nbsp sont normaux ... Smiley confused heu pas trés beau mais bon !!
En effet j'avais pass vu dans les META les majuscules restantes merci a toi ! Smiley biggrin
Mille mercis a vous toutes et tous !!

Le resultat, tout est validé 100% et il accepte mais onmouseover etc ...
vous m'avez trop bien aidé Smiley clapclap
Sujet clos
Aller à