xzonz
Messages postés103Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention23 novembre 2022
-
10 janv. 2011 à 18:07
squonk14
Messages postés16Date d'inscriptionmardi 20 avril 2010StatutMembreDernière intervention20 juin 2012
-
12 janv. 2011 à 16:56
bonjour a toutes et tous
voila ma question:
j'ai une page toute simple (pour le moment)
sur laquelle il y a des liens pointant
vers des images.
il y a une fonction javascript qui me permet
d'afficher l'image quand on passe la souris sur le lien ... jusqu'ici rien de bien sorcier...
ca fonctionne.
maintenant je voudrai que l'image soit redimensionnée en gardant les proportions
quand on passe la souris sur le lien.
(quatre fois plus petite par exemple)
j'ai essayé plein de trucs ... sans succès
pourriez vous me donner un coup de main
svp ... car la je galère bien !!
voila le code de la page
merci de votre aide
--------------------------------------------
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script>
decal_x = 25;
decal_y = -15;
document.onmousemove = suivre_souris0;
var contenu
function pop0(contenu)
{
document.getElementById("bulle").innerHTML = ""+contenu+"
";
}
function suivre_souris0(e)
{
if (navigator.appName=="Microsoft Internet Explorer")
{
var x event.x + document.body.scrollLeft; var y event.y + document.body.scrollTop;
}
else
{
var x e.pageX;var y e.pageY;
}
document.getElementById("bulle").style.left x + decal_x; document.getElementById("bulle").style.top y + decal_y;
}
function disparaitre0()
{
document.getElementById("bulle").innerHTML = '';
}
squonk14
Messages postés16Date d'inscriptionmardi 20 avril 2010StatutMembreDernière intervention20 juin 2012 12 janv. 2011 à 16:56
Bonjour,
j'ai essayé en rajoutant un % dans la balise img mais ça ne passe pas bien sur tous les navigateurs, et même lorsque ça passe le comportement est bizarre (la taille change légèrement lorsqu'on déplace la souris).
Faute de mieux je te propose un truc avec une taille fixe (j'ai mis 200).
Ca donne le code suivant
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script>
decal_x = 25;
decal_y = -15;
document.onmousemove = suivre_souris0;
var contenu
function pop0(contenu)
{
document.getElementById("bulle").innerHTML = '
';
}
function pop1(contenu)
{
document.getElementById("bulle").innerHTML = '
'+contenu+'
';
}
function suivre_souris0(e)
{
if (navigator.appName=="Microsoft Internet Explorer")
{
var x event.x + document.body.scrollLeft; var y event.y + document.body.scrollTop;
}
else
{
var x e.pageX;var y e.pageY;
}
document.getElementById("bulle").style.left x + decal_x; document.getElementById("bulle").style.top y + decal_y;
}
function disparaitre0()
{
document.getElementById("bulle").innerHTML = '';
}
</script>
[../../Documents GAL1/Mes images/1x1280x1024.jpg nassim1]
[../../Documents GAL1/Mes images/2x1280x1024.jpg nassim3]
[../../Documents GAL1/Mes images/3x1280x1024.jpg nassim4]
[../../Documents GAL1/Mes images/4x1280x1024.jpg nassim5]
[../../Documents GAL1/Mes images/5x1280x1024.jpg nassim6]
</html>
J'ai enlevé le table qui ne sert pas a grand chose ici et remplacé l'argument de ta fonction pop0 par le chemin de l'image. Si tu veux absolument mettre la balise entière comme argument de ta fonction, il faut faire attention aux quotes. Je t'ai créé une fonction pop1 qui est appelé sur nassim6 en remplaçant les quotes par leurs codes jesaisplusquoi.
Voilà, j'espère que ça t'aidera un peu.
-------------------------------------------------------------
Il ne suffit pas d'être inutile. Encore faut-il être odieux.