High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Légende galerie photo html

Dernière réponse le 28 aoû 2008 à 11:04:43 syrinxxxx, le 24 aoû 2008 à 18:50:12 
 Signaler ce message aux modérateurs

Bonjour,
j'ai une galerie photo toute simple dont le code est celui ci :

je cherche a rajouter une legende qui changerait en meme temps un swap text ( je sais pas si ca existe)

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div align="center">
<p><img src="images/galeriefontaine/thumb_fontaine01.jpg" alt="fontaine01" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine01.jpg',1)" /> <img src="images/galeriefontaine/thumb_fontaine02.jpg" alt="fontaine02" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine02.png',1)" /> <img src="images/galeriefontaine/thumb_fontaine03.jpg" alt="fontaine03" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine03.png',1)" /> <img src="images/galeriefontaine/thumb_fontaine04.jpg" alt="fontaine04" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine04.png',1)" /> <img src="images/galeriefontaine/thumb_fontaine05.jpg" alt="fontaine05" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine05.png',1)" /> <img src="images/galeriefontaine/thumb_fontaine06.jpg" alt="fontaine06" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine06.png',1)" /> <img src="images/galeriefontaine/thumb_fontaine07.jpg" alt="fontaine07" width="75" height="42" onmouseover="MM_swapImage('fontaine_large','','images/galeriefontaine/fontaine07.png',1)" /></p>
<p> </p>
</div></td>
</tr>
<tr>
<td><div align="center"><img src="images/galeriefontaine/fontaine01.jpg" alt="fontaine_large" name="fontaine_large" width="697" height="397" id="fontaine_large" /></div></td>
</tr>
</table>

Configuration: Mac OS X
Firefox 3.0.1n

Posez votre question Répondre

1

syrinxxxx, le 24 aoû 2008 à 19:12:12

Ooops y a ca ausi comme code jsute avant :

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

   
Répondre à syrinxxxx

2

syrinxxxx, le 24 aoû 2008 à 19:12:50

Quelqu'un aurait-il la gentillesse de m'aider ? :(

   
Répondre à syrinxxxx

3

dreamfeeder, le 24 aoû 2008 à 21:21:39

Bonjour,

je ne comprend pas tres bien ce que tu veux faire en fait.
tu souhaite rajouter une legende ou? et qu'entend tu par swap text?

cordialement, dreamfeeder.

   
Répondre à dreamfeeder

4

syrinxxxx, le 25 aoû 2008 à 23:05:05

Alors j'ai une galerie photo que j'ai faite en utilisant une table coupé en deux colonne dans celle de droite j'ai mis les thumbnails dans celle de gauche la premiere foto en grand, puis pour tout les thumbnails j'ai ajouter un "swap image" c'est-a-dire que lorsque que l'on clique sur le thumb l'image d'origine est remplacée par l'image du thumb.
je voudrais savoir s'il est possible de faire apparaitre en dessous ma photo (pour chaque photo swapper une legende) en clair dans le code qu'il y a dans le premier post ou puis-je rajouter le code de la legende pour qu'il reagisse avec le swap ?

je sais pas si j'ai ete plus clair en tout cas merci de t'interesser :-)

   
Répondre à syrinxxxx

5

PhP, le 25 aoû 2008 à 23:43:44
  • +1

Bsr

Avec le code MacroMedia (beurk !) non

Comme ceci oui 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Gallerie</title>

<style>
*
{
	font-family : arial;
	font-size : 12pt;
}

body
{
	margin : 10px;
	padding : 0px;
	border : 0px;

}

.titre
{
	font-weight : bold;

}

</style>

<script>
function ImageItem(url,txt)
{
	this.url = url;
	this.txt = txt;
}

function ImageList(imgId,txtId)
{
	this.imgId = imgId;
	this.txtId = txtId;
	this.items = new Array();
}

ImageList.prototype.add = function(url,txt)
{
	var item = new ImageItem(url,txt);
	this.items.push(item);
	return item;
}

ImageList.prototype.swap = function(index)
{
	document.getElementById(this.imgId).src = this.items[index].url;
	document.getElementById(this.txtId).innerHTML = this.items[index].txt;
}

var imageList = new ImageList("fontaine_large","fontaine_txt");


function load()
{
	imageList.add("images/galeriefontaine/fontaine01.png","Ceci est l'image 1");   // Image 0
	imageList.add("images/galeriefontaine/fontaine02.png","Prise de vue du ...."); // Image 1 
	imageList.add("images/galeriefontaine/fontaine03.png","Zoom");                 // Image 2 
	// Etc ...
}

</script>
</head>
<body onload="load()">
<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
	<tr> 
	<td>
		<div align="center"> 
		<img src="images/galeriefontaine/thumb_fontaine01.jpg" alt="fontaine01" width="75" height="42" onmouseover="imageList.swap(0)" /> 
		<img src="images/galeriefontaine/thumb_fontaine02.jpg" alt="fontaine01" width="75" height="42" onmouseover="imageList.swap(1)" /> 
		<img src="images/galeriefontaine/thumb_fontaine03.jpg" alt="fontaine01" width="75" height="42" onmouseover="imageList.swap(2)" /> 
		<br />&nbsp;
		</div>
	</td> 
	</tr> 
	<tr> 
	<td>
		<div align="center"><img src="images/galeriefontaine/fontaine01.png" alt="fontaine_large" name="fontaine_large" width="697" height="397" id="fontaine_large" />
		<p id="fontaine_txt" class="titre">Ceci est l'image 1</p>
		</div>
	</td>
	</tr>
</table>
</body>
</html>


PhP  
Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...

   
Répondre à PhP

6

syrinxxxx, le 27 aoû 2008 à 18:12:10

Cool merci je vais integrer ca dans ma page.
En passant pourquoi le code macromedia serait-il beurk ?

   
Répondre à syrinxxxx

7

PhP, le 27 aoû 2008 à 18:28:02

Bsr

En passant pourquoi le code macromedia serait-il beurk ?
Parce qu'il n'est déjà pas très lisible, pas vraiment documenté et qu'il s'appuie sur des fonctionnalités spécifiques à d'anciennes versions des navigateurs qui n'ont plus lieu d'être sauf à utiliser encore Netscape 4 ou IE 4 par ex
Notamment la fonction findObj qui semble rechercher un objet par son attribut name un peu partout avant de finir par utiliser getElementById, LA fct qu'aujourd'hui tout navigateur digne de ce nom qui implémente Javascript et DOM se doit de supporter.

PhP  
Il y a 10 types de personnes dans le monde : ceux qui compre­nnent le binaire et les autres ...

   
Répondre à PhP

8

syrinxxxx, le 27 aoû 2008 à 18:46:30

Ok merci de toutes ces explications.
ton code fonctionne a merveilles.
ca voudrait dire aussi que lorsqu'on utilise dreamweaver en mode design c'est pas top.

   
Répondre à syrinxxxx

9

PhP, le 27 aoû 2008 à 18:56:05

Non ça veut juste dire que pour des raisons commerciales et de compatiblité Dreamweaver se doit d'interpréter correctement des pages conçues avec d'anciennes versions de DW pour d'anciens navigateurs. C'est la moindre des choses pour un soft payant.
Pour le reste il génère du code HTML assez propre.

Par contre quand tu codes toi même tu ne t'occupes plus des vieux navigateurs comme IE 5, Netscape ou FF 1 : tu vas à l'essentiel

Comme tu as pu le constater DW est limité niveau Javascript : dès que tu veux faire un peu différemment (affiché un texte dans ton cas lors d'un swap) ce n'est plus possible. Ca reste malgrès tout un outils sympa et wisiwyg (par contre lorsqu'on code en PHP il ne sert plus à grand chose)

PhP  
Il y a 10 types de personnes dans le monde : ceux qui compre­nnent le binaire et les autres ...

   
Répondre à PhP

10

syrinxxxx, le 28 aoû 2008 à 08:31:23

Ooops besoin d'un suivi conso pour le code des galeries j'en ai plusieurs a faire et je comprends pas pourquoi les deux premiere on fonctionnées et les autres me charge plus les images

mes galeries sont tres simple j'ai une page type avec le menu du site une photo de la section galerie et une table ou je met la galerie,... donc pour faire les autres galeries j'ai dupliquer la page de la premiere galerie et

changer les sources dans" function load()" et <div align="center"><img src="images/galerie....(ca je le change)

et aussi dans la derniere ligne qui affiche la photo en grand j'ai mis a chaque fois la premiere photo de la serie.
Mais j'ai laissé le "fontaine_large" et fontaine_text" partout

je comprends pas pourquoi pour les deux premiere ca marche et pas pour les autres alors que je duplique la page en changenat juste ce que je t dis
(pardon de faire le boulet mon erreur doit etre bete)

   
Répondre à syrinxxxx

11

syrinxxxx, le 28 aoû 2008 à 08:43:57

Le probleme c'est que quoi que je change dans mon preview dreamweaver ca fonctionne mais une fois uploader sur le serveur ca marche ca m'affiche la premiere image et les autre ca ecris le nom donner a la premiere

   
Répondre à syrinxxxx

12

syrinxxxx, le 28 aoû 2008 à 09:06:46

Ouai c'est vraiment une question bete
j'utilise site management pour uploader et j'ai demander a dream de mettre tout les fichier qui dependent d'une page que j'uploade mais je savais pas qu'il savait pas lire les scripts du coup toute les photo du script il les a pas mise et c pour ca qu'on voyait que la premiere

   
Répondre à syrinxxxx

13

PhP, le 28 aoû 2008 à 09:42:20

Bjr

ben vi ;-) DW ne peut pas deviner quelles images ton script utilise tu dois les uploader séparément
PhP  
Il y a 10 types de personnes dans le monde : ceux qui compre­nnent le binaire et les autres ...

   
Répondre à PhP

14

 syrinxxxx, le 28 aoû 2008 à 11:04:43
  • +1

Hihi ben j'avoue que sur ce coup la j'ai pas etait tres percpicace car effectivement le script n'a pas de code de couleur j'aurai du comprendre qu'il ne savait pas le lire ca m'aurais eviter de refaire plusieurs fois mes six galeries en m'arrachant les cheveux et en pestant contre ce pauv' dreamweaver :D

sinon vu que tu repond juste a plein de monde (me suis un peu balader sur le forum ) t'as ptet une idée sur mon dernier post ?

   
Répondre à syrinxxxx
Posez votre question Répondre
Ils ont besoin de votre aide