afficher une image plus grande sans chargement initial

Version imprimable

20/02/2008, 14h46
Phiss

afficher une image plus grande sans chargement initial

Bonjour,

J'aimerais avoir une fonction qui permet, lors d'un survol d'une image, d'ouvrir une autre image sur la page.
Je précise.

J'ai une liste d'images qui se suivent en hauteur.
je veux que lorsque l'on survole les images avec la souris cela ouvre une autre fenêtre (popup, frame, div ou autre je ne sais pas) avec une image plus grande.

Ce que je souhaite c'est que cette page ne soit pas chargée en même temps que la page principale pour une raison de chargement de la page.

Vous voyez ce que je veux dire?

Merci d'avance.
20/02/2008, 14h48
SpaceFrog

je te conseillerais d'utilser window prototype avec un chargement de l'image en ajax ...
20/02/2008, 14h52
genosite

Ce ne serait pas mieux d'ouvrir la page lors du clique ?
Event.onclick
21/02/2008, 09h45
Phiss

Salut

J'ouvre une page lors du clic.
Mais pas la même.

La c'est vraiment un aperçu un peu plus important que je veux mettre en place.

J'utilisais des div masqués que j'affichais mais le souci était que tout était chargé lors de l'appel de la page.
Donc j'ai laissé tombé car c'était trop lourd.

La j'étais toujours sur des div mais qui appelait une page et ce lors du passage de la souris. Du coup le premier chargement de la page se fait lors du premier passage de la souris.
Le truc c'est que sur IE cela marche pas.

j'ai regardé pour windows prototyp avec de l'ajax mais c'est quelques choses que je ne maitrise pas du tout.
Tu as pas un lien qui pourrait m'être utile du genre aide en ligne ou tutoriel?
21/02/2008, 09h48
SpaceFrog

http://dcabasson.developpez.com/arti...totype-window/

voilà actuellement ce que j'utilise et qui marche sous FF mais pas IE.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function envoieRequete(url,id)
	{
		var xhr_object = null;
		var position = id;
		if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
		else
		if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
 
		// On ouvre la requete vers la page désirée
		xhr_object.open("GET", url, true);
		xhr_object.onreadystatechange = function()
		{
			if ( xhr_object.readyState == 4 )
			{
				// j'affiche dans la DIV spécifiées le contenu retourné par le fichier
				//alert(xhr_object.responseText);
				document.getElementById(position).innerHTML = xhr_object.responseText;				
			}
		}
		// dans le cas du get
		xhr_object.send(null);
 
	}

l'erreur que me renvoi IE serait sur la ligne de commande

Code:

1
2
 
document.getElementById(position).innerHTML = xhr_object.responseText;

Vous voyez pourquoi?

21/02/2008, 15h20
SpaceFrog

ton url pointe sur quoi ?
une page php ???
il y a quoi dans ton responseText ?
21/02/2008, 16h24
Phiss

Mon url est une page ou je n'ai qu'un balise image, en gros.
C'est une .asp mais bon cela reste pour ainsi dire que du code html.

Sinon lorsque je fais le

Code:

alert(xhr_object.responseText)

j'ai bien le code de la page qui est affiché.
Et cela sous IE ou FF.
21/02/2008, 16h29
MANU_2

tiens, j'ai trouver ça, c'est top : http://vikjavev.no/highslide/
21/02/2008, 16h30
SpaceFrog

le code de la page ou juste la balise img ?

Avec le alert j'ai tout le code de la page.

Code:

1
2
3
4
5
6
7
8
9
10
11
 
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  <title></title>
  <meta http-equiv="Expires" content="">
 </head>
 <body>
 <div align=center><img src='images/imagetest.jpg' border='0'></div>
 </body>
</html>

21/02/2008, 17h02
SpaceFrog

il ne faut QUE la balise image ....

tu insère un code html dasn une page html donc pas de balises html body etc ...
21/02/2008, 17h21
Phiss

Ça marche.

Merci bien de l'aide.
21/02/2008, 17h30
SpaceFrog

Citation:

Envoyé par MANU_2

tiens, j'ai trouver ça, c'est top : http://vikjavev.no/highslide/

pourquoi aller chercher des truc payants pour des applications commerciales alors qu'il existe mieux en totalement libre et que de toute façon Phiss s'en est sorti ...