Sujet Précédent Sujet Suivant

Problème de position d'une image lors du survol d'un lien

cs_molio Messages postés 4 Date d'inscription vendredi 5 février 2010 Statut Membre Dernière intervention 8 février 2010 - 7 févr. 2010 à 11:02
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 7 févr. 2010 à 13:56
Bonjour,

J'essaie de faire un site internet pour mon laboratoire.
je souhaite faire apparaitre une image qui suit la souris au survol d'un lien vers une page web.
j'ai un problème de code apparemment quand j'ouvre la page tout va bien, l'image apparait à côté du pointeur mais si je scroll l'image se décale au fur et à mesure!!! j'ai bien vu qu'il fallait ajouter le scroll au coordonnées de la souris mais je ne sais pas comment m'y prendre...

merci d'avance

voici mon code:

<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Publications</title>

<script type="text/javascript">

//<!--
document.onmousemove = suitsouris;
function suitsouris(evenement)
{
if(navigator.appName=="Microsoft Internet Explorer")
{
var x = event.x+document.body.scrollLeft;
var y = event.y+document.body.scrollTop;
}
else
{
var x = evenement.pageX;
var y = evenement.pageY;
}
document.getElementById("image 1").style.left = (x+1)+'px';
document.getElementById("image 1").style.top = (y+1)+'px';
document.getElementById("image 2").style.left = (x+1)+'px';
document.getElementById("image 2").style.top = (y+1)+'px';
}
//-->
</script>
<style type="text/css">

a .grand {
display: block;
position: absolute;
width: 0px;
}
a:hover .grand {
position: absolute;
top: 30px;
left: 100px;
width: auto;
height: auto;
}

#corpsdetexte
a {
text-decoration: none;
color: #000099;
font-size: 1em;
font-weight: bold;
font-family: Times;
}

</style>
<style type="text/css">

#conteneur{
position: absolute;
width: 1009px;
left: 44%;
margin-left: -427px;
}

</style>
<style type="text/css">

#menu
a:hover {
color: #FF33FF;
font-style: italic;
font-family: helvetica;
}
a {
text-decoration: none;
color: #000099;
font-size: 1em;
font-weight: bold;
font-family: helvetica;
}

</style>
<style type="text/css">

#corpsdetexte{
position: absolute;
text-decoration: none;
color: black;
font-size: 1em;
font-family: Times New Roman;
}

</style>
</head>
















1. "Titre"
auteur Titre journal 2010, 10, 2100.


2. "Titre"
auteur Titre journal 2010, 10, 2100.




<small>[index.html Home]

[Dr.%20G%C3%A9rard%20Cahiez.html Prof. Dr. Gérard Cahiez]

[Group%20members.html Group members]

[Research.html Research]

[Publications.html Publications]

[Prospectives%20students.html Prospectives students]

[Opportunities.html Opportunities]

[Group%20photo.html Group photo]

[Contacts.html Contacts]



</small>





</html>

1 réponse

Réponse 1 / 1
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
7 févr. 2010 à 13:56
Bonjour,
plutôt que de grand discours je t'engage à lire le TUTO POSITION DE LA SOURIS DANS LA PAGE, tu auras la réponse à ta question...
;O)
0

Discussions similaires

vectoriser un logo sous photoshop
cs_babidou -
harleyman37 -

11 réponses
Signaler un lien mort
cs_Rimb0 -
ImmortalPC -

6 réponses
Trouver le rang d'une lettre dans l'alphabet
cs_charlax -
charlax -

11 réponses
[Photoshop] : Image noir et blanc en image blanc et noir ?
kristoufiol -
titoine2000 -

4 réponses
position aléatoire d'un image dans une page HTML
valerie6983 -
PetoleTeam -

8 réponses
Rejoignez-nous