Afficher la bonne image au survol

Résolu/Fermé
Jean_2 Messages postés 245 Date d'inscription lundi 24 septembre 2007 Statut Membre Dernière intervention 13 septembre 2013 - 8 nov. 2007 à 15:33
 leSurvivant - 9 nov. 2007 à 08:10
Bonjour,

Je voudrai faire un script qui fait quand je survole un lien ça m'affiche la capture d'écran correspondante.

ex : quand je survole acceuil, j'ai la capture d'écran (une image, quoi) de mon acceuil.qui apparait dans le div capture_d_ecran_pour_plan_de_site


<div id="capture_d_ecran_pour_plan_de_site"></div>
<ol>
<li><a href="index.php3" >Accueil</a></li>
<li><a href="presentation.php">Présentation</a></li>
...
...
</ol>

Pourriez vous me donner des pistes ???

merci
A voir également:

4 réponses

Salut Jean_2,
essaye ça:
<div id="capture_d_ecran_pour_plan_de_site" onmouseover="UneFonction()"></div>


Et entre tes balises head, rajoute:
<script text="javascript">
UneFonction()
{
imageplacee = document.getElementById("capture_d_ecran_pour_plan_de_site")
imageplacee.backgroundImage = url('LeNomDeTonImage")
}

</script>


Cordialement
0
Jean_2 Messages postés 245 Date d'inscription lundi 24 septembre 2007 Statut Membre Dernière intervention 13 septembre 2013 12
8 nov. 2007 à 16:04
bonne piste, mais ça bug non ?

les id sont à reperer dans ma liste non ?

merci leSurvivant,
0
Jean_2 Messages postés 245 Date d'inscription lundi 24 septembre 2007 Statut Membre Dernière intervention 13 septembre 2013 12
8 nov. 2007 à 18:45
c'est résolu, je dois adapter pour chaque élément de ma liste :
le javasript :

function montrer_capture_d_ecran(id)
{
var variable = document.getElementById(id);
if (variable)
{
variable.style.display = "block";
}
}
function masquer_capture_d_ecran(id)
{
var variable = document.getElementById(id);
if (variable)
{
variable.style.display = "none";
}
}

le code html pour un élément de ma liste :
<li>
<a href="index.php3" onmouseover="javascript:montrer_capture_d_ecran('acceuil');" onmouseout="javascript:masquer_capture_d_ecran('acceuil');">Accueil</a>
<img id="acceuil" src="images/acceuil.png" width="260px" height="186px" alt="acceuil" />
</li>

le css pour cet élément :
li img{
position:absolute;
top:230px;
right:350px;
display:none;
}
0
Bonjour,
ok pour la solutio.
Félicitation et bonne continuation!!

ps: leSurvivant fait référence a Harry Potter, désolé.
0