Aide pour image

**ploployas** · 27/12/2009, 18h32

Salut à tous,

voila je suis novice dans le webmastering, et actuellement je bidouille sur dreamweaver.

Et donc j'essai de trouver comment faire pour que lorsque j'ai des images miniature
et quand je click dessus celle-ci apparaissent dans un cadre qui ce situerait juste en dessus mais sans qu'il y ai changement de page. Pour vous faire une idée plus précise j'ai mis un lien.

http://moe.mabul.org/up/moe/2009/12/...73929hy771.png

Je sais pas si je me suis bien exprimé, désolé je débutes.

J'ai aussi mis les codes pour vous faire une meilleur idée.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
body { 
width: 780px; 
margin: auto; 
} 
#zone-image { 
height: 400px; 
width: 550px; 
margin-right: auto; 
margin-left: auto; 
} 
#image-miniature { 
height: 56px; 
width: 154px; 
margin-right: auto; 
margin-left: auto; 
} 
--> 
</style></head> 
 
<body> 
<div id="zone-image"></div> 
<div id="image-miniature"><img src="iphone.jpg" width="77" height="56" alt="iphone" /><img src="iphone2.jpg" width="77" height="56" alt="iphone2" /></div> 
</body> 
</html>

Invité · 28/12/2009, 19h32

bonjour

un petit exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<script type="text/javascript">
 
 function change(imageaaffiche){
document.getElementById('coucou').src=imageaaffiche
}
</script>
</head>
<body>
<img id ='coucou' src ='d4g.jpg'>
<br>
<img src ='d1.jpg'onmouseover="change('d1g.jpg')">
<img src ='d2.jpg'onmouseover="change('d2g.jpg')">
<img src ='d3.jpg'onmouseover="change('d3g.jpg')">
 
</body>
</html>

**emmanuel.remy** · 28/12/2009, 20h55

Salut

Et si tu es confronté à une certaine lenteur dûe au chargement des images au fil de l'eau, tu peux les précharger, il existe des dizaines de script, par exemple (issue ce post):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
var imagesPrechargees=new Array();// <-- un tableau qui contiendra toutes les variables d'images
var mesImagesSources=['1.png','2.png','3.png'];// <-- les adresses des images
for(var i=0;i<3;i++){
  imagesPrechargees[i]=new Array();
  imagesPrechargees[i].src=mesImagesSources[i];
}

Bon dev,

ERE

Aide pour image

JavaScript

Discussions similaires

Partager

Partager