[javascript] fonction getElementById - besoin d'aide

Logiciel & apps Programmation
1

Bonjour,

Je souhaite créer un lien texte qui au survol de la souris change à la fois de texte mais aussi de style.

<A HREF="mapage" STYLE="color:#696969" onMouseOver="document.getElementById?this.style.color='#989898':null;document.getElementById?this.innerHTML='Texte deux':null" onMouseOut="document.getElementById?this.style.color='#696969':null;document.getElementById?this.innerHTML='Texte un':null">Texte un</A>

Avec ceci le texte est bien modifié la couleur aussi mais si j’essaye toute autre modification comme par exemple changer la taille ou la graisse du texte ca ne fonctionne pas.

ne fonctionne pas :

<A HREF="mapage" STYLE="font-size:1.2em" onMouseOver="document.getElementById?this.style.font-size='1em':null;document.getElementById?this.innerHTML='Texte deux':null" onMouseOut="document.getElementById?this.style.font-size='1.2em':null;document.getElementById?this.innerHTML='Texte un':null">Texte un</A>

Je suis un bon débutant en javascript, auriez vous de quoi m’aider ?
Merci d’avance :slight_smile:

2

un autre exemple :

<A HREF="mapage" STYLE="font:12pt" onMouseOver="document.getElementById?this.style.font='8pt':null;document.getElementById?this.innerHTML='Texte deux':null" onMouseOut="document.getElementById?this.style.font='12pt':null;document.getElementById?this.innerHTML='Texte un':null">Texte un</A>

la taille du texte se réduit bien mais le texte ne change plus : /

3

Bonjour,
-pour plus de clarté: appelle une fonction Javascript, à laquelle tu passe (this) en paramètre pour appliquer tes styles.
-document.getElementById? doit être inutile, tu appelle directement les méthodes sur le this.
-ensuite tu peux essayer aussi de faire des classes css et de changer dynamiquement ces classes. :neutre:

par “bon débutant” je suppose que ça veut dire que tu saiot t’investir dans la doc, voici quelques liens pour commencer, j’ai toujours à portée de main une référence HTML+JS+CSS pour me tenir au courant des évolutions et recherche la meilleure méthode possible:

http://www.w3schools.com/tags/default.asp
http://www.w3schools.com/js/js_obj_htmldom.asp
http://www.w3schools.com/css/css_reference.asp
http://fr.selfhtml.org/javascript/objets/node.htm

par contre, je n’ai trouvé aucun lien du niveau des livre o’reilly :confused: