[résolu] changement de texte à un endroit précis avec _ onmouseover

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [résolu] changement de texte à un endroit précis avec _ onmouseover

le_phoenix

Bonjour!

J'aimerais que dons mon site, quand je survole des icones une description apparaisse dans un tableau, sous forme de texte dynamique.
J'ai essayé d'utiliser du code javascript trouvé sur internet, mais il y a un problème...

Pouvez vous m'aider SVP?

Liens:

Code :

<a href="javascript:;" onmouseover='changetext("description,1" )'><img src="boutons/forum.jpg" width="51" height="43" border="0"></a>
<a href="javascript:;" onmouseover='changetext("description,2" )'><img src="boutons/videos.jpg" width="51" height="43" border="0"></a>

zone changement de texte

Code :

<td id='description' colspan="3" rowspan="2" bgcolor="#000000">
<script type='text/javascript'>
function changetext(id,choix)
{
if(choix==1){
area = document.getElementById(id);
area.innerHTML="texte1";
}
if(choix==2){
area = document.getElementById(id);
area.innerHTML="texte2";
}
}
</script>
texte 0
</td>

Message édité par le_phoenix le 29-10-2007 à 12:05:15

Publicité

gatsu35

Blablaté par Harko

Code :

<a onmouseover='changetext("description,1" )'>

tu te plantes avec les guillemets, tu fous tes 2 parametres entre guillement donc ta fonction ne recoit qu'un seul parametre du coup
ben ca plante
donc il faut faire ceci :

Code :

<a onmouseover="changetext('description',1 )">

Message édité par gatsu35 le 27-10-2007 à 00:56:06

le_phoenix

Merci!

En effet maintenant ça fonctionne très bien! Je me doutais que ce n'était pas grand chose, mais ça suffit pour tout faire planter...
alors merci pour cette rectification Gatsu35!

Pour ceux que ça intéresserait de pouvoir changer le texte à un endroit précis de la page en passant la souris sur une image,
voici le code correct:

Tout d'abord placez ce script entre <head> et </head> :

Code :

<script type='text/javascript'>
function changetext(id,choix)
{
if(choix==1){
area = document.getElementById(id);
area.innerHTML="texte1";
}
if(choix==2){
area = document.getElementById(id);
area.innerHTML="texte2";
}
}
</script>

if(choix==1) correspond à la première image avec la fonction changetext qui a comme 2e paramètre "1"
choix==2 >> image avec le paramètre 2
etc...

Deuxième étape, faire le lien sur l'image à survoler (ou un texte ou un tableau...)

pour des images:

Code :

<a href="javascript:;" onmouseover="changetext('textdynamic',1)"><img src="image1.jpg" ></a>
<a href="javascript:;" onmouseover="changetext('textdynamic',2)'><img src="image2.jpg"></a>

ajoutez autant de fois la ligne que vous voulez, en changeant bien le numéro à chaque fois!
Pour ajouter un lien cliquable, rajouter un événement onclick

Pour changer le texte dans la page, ajoutez une id à un objet (cellule, span, div, etc...).
Cette id doit porter le même nom que le premier paramètre de la fonction dans le lien (ici ma zone s'appelle description, mais vous pouvez choisir un autre endroit de la page et donner une autre id)

exemple:
zone changement de texte 1 = endroit de la page avec position absolue
:non: bien utiliser à chaque fois la balise SPAN sinon ce ne sera pas compatible avec IE

Code :

<span id="textdynamic" style="position:absolute; left:263px; top:123px; width:294px; height:186px; z-index:5; visibility: visible">
ici se trouve le texte (html) avant qu'il soit changé par le passage de la souris sur les images <br>
vous pouvez y mettre des images ou tout ce que vous voulez en format html!
</span>

zone changement de texte 2 = autre endroit n'importe où dans la page: (à mettre par exemple à l'intérieur d'un tableau, ou n'importe où!!!)

Code :

<span id='zone2' >
<b>passez la souris sur l'une des icones</b>
</span>

En n'oubliant pas de mettre dans le lien:
onmouseover="changetext('zone2',1)"

Message édité par le_phoenix le 29-10-2007 à 12:13:26

le_phoenix

J'ai corrigé un problème d'incompatibilité avec Internet Explorer.

Apparemment avec IE, seule la balise SPAN permet une bonne éxécution du script, si on met <td id='zone2'> ça ne fonctionne qu'avec Firefox!

Je mettrai bientôt une page d'exemple

FORUM HardWare.fr

Programmation

HTML/CSS

[résolu] changement de texte à un endroit précis avec _ onmouseover

Sujets relatifs
vba - userform - composant calendrier RESOLU	[RESOLU] ouverture et fermeture d'une popup
[SQL,ORACLE]Message d'erreur mutating, trigger....(RESOLU)	[Résolu] Fonction allergique à une requête MySQL
[Resolu] Problème sur realbox	[Résolu] Soucis avec toggle Javascript
[Résolu] Lister les fichiers d'un dossier	[résolu] Recherches parallèles LDAP
[resolu]Affichier resultat de ma requete dans un cadre de ma page PHP	Créer un texte dont chaque mot pointe vers une note.
Plus de sujets relatifs à : [résolu] changement de texte à un endroit précis avec _ onmouseover

Page générée en 0.059 secondes