slideshow immagini con descrizione

**MoNaLiSa** · 21-09-2006, 14:40

ciao a tutti! nella la pagina che vedete sotto ho un script per vedere delle immagini in slideshow. Vorrei che sotto ogni immagine apparisse la rispettiva descrizione... come devo fare?
grazie in anticipo, ciao Fra

codice:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>titolo pagina</title>
<script language="JavaScript">

// PUT THE URL'S OF YOUR IMAGES INTO THIS ARRAY...
var Slides = new Array('foto1.jpg','foto2.jpg','foto3.jpg');

// DO NOT EDIT BELOW THIS LINE!
function CacheImage(ImageSource) { // TURNS THE STRING INTO AN IMAGE OBJECT
   var ImageObject = new Image();
   ImageObject.src = ImageSource;
   return ImageObject;
}

function ShowSlide(Direction) {
   if (SlideReady) {
      NextSlide = CurrentSlide + Direction;
      // THIS WILL DISABLE THE BUTTONS (IE-ONLY)
      document.SlideShow.Previous.disabled = (NextSlide == 0);
      document.SlideShow.Next.disabled = (NextSlide == 
(Slides.length-1));    
 if ((NextSlide >= 0) && (NextSlide < Slides.length)) {
            document.images['Screen'].src = Slides[NextSlide].src;
            CurrentSlide = NextSlide++;
            Message = 'Picture ' + (CurrentSlide+1) + ' of ' + 
Slides.length;
            self.defaultStatus = Message;
            if (Direction == 1) CacheNextSlide();
      }
      return true;
   }
}

function Download() {
   if (Slides[NextSlide].complete) {
      SlideReady = true;
      self.defaultStatus = Message;
   }
   else setTimeout("Download()", 100); // CHECKS DOWNLOAD STATUS EVERY 100 MS
   return true;
}

function CacheNextSlide() {
   if ((NextSlide < Slides.length) && (typeof Slides[NextSlide] == 
'string'))
{ // ONLY CACHES THE IMAGES ONCE
      SlideReady = false;
      self.defaultStatus = 'Downloading next picture...';
      Slides[NextSlide] = CacheImage(Slides[NextSlide]);
      Download();
   }
   return true;
}

function StartSlideShow() {
   CurrentSlide = -1;
   Slides[0] = CacheImage(Slides[0]);
   SlideReady = true;
   ShowSlide(1);
}
</script>
</head>
<body background="../images/clearday.jpg" onLoad="StartSlideShow()">


<form name="SlideShow">
  <center>
    <table>
      <tr>
        <td colspan=2><img name="Screen" width=512 height=342></td>
    </tr>
      <tr>
        <td><input type="button" name="Previous" 
value=" << "
onClick="ShowSlide(-1)"></td>
       <td align="right"><input type="button" name="Next"
value=" >> " onClick="ShowSlide(1)"></td>
    </table>
  </center>
</form>
</body>
</html>

**MoNaLiSa** · 21-09-2006, 22:22

up

**MoNaLiSa** · 23-09-2006, 15:39

nessuno nessuno mi può aiutare?

**cavicchiandrea** · 23-09-2006, 16:42

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>titolo pagina</title>
<script language="JavaScript">

// PUT THE URL'S OF YOUR IMAGES INTO THIS ARRAY...
var Slides = new Array('foto1.jpg','foto2.jpg','foto3.jpg');
var desc = new Array('descrizone foto 1','descrizione foto 2','descrizione foto 3');
// DO NOT EDIT BELOW THIS LINE!
function CacheImage(ImageSource) { // TURNS THE STRING INTO AN IMAGE OBJECT
   var ImageObject = new Image();
   ImageObject.src = ImageSource;
   return ImageObject;
}

function ShowSlide(Direction) {
   if (SlideReady) {
      NextSlide = CurrentSlide + Direction;
      // THIS WILL DISABLE THE BUTTONS (IE-ONLY)
      document.SlideShow.Previous.disabled = (NextSlide == 0);
      document.SlideShow.Next.disabled = (NextSlide == 
(Slides.length-1));    
 if ((NextSlide >= 0) && (NextSlide < Slides.length)) {
            document.images['Screen'].src = Slides[NextSlide].src;
			document.getElementById("desc").innerHTML=desc[NextSlide]
            CurrentSlide = NextSlide++;
            Message = 'Picture ' + (CurrentSlide+1) + ' of ' + 
Slides.length;
            self.defaultStatus = Message;
            if (Direction == 1) CacheNextSlide();
      }
      return true;
   }
}

function Download() {
   if (Slides[NextSlide].complete) {
      SlideReady = true;
      self.defaultStatus = Message;
   }
   else setTimeout("Download()", 100); // CHECKS DOWNLOAD STATUS EVERY 100 MS
   return true;
}

function CacheNextSlide() {
   if ((NextSlide < Slides.length) && (typeof Slides[NextSlide] == 
'string'))
{ // ONLY CACHES THE IMAGES ONCE
      SlideReady = false;
      self.defaultStatus = 'Downloading next picture...';
      Slides[NextSlide] = CacheImage(Slides[NextSlide]);
      Download();
   }
   return true;
}

function StartSlideShow() {
   CurrentSlide = -1;
   Slides[0] = CacheImage(Slides[0]);
   SlideReady = true;
   ShowSlide(1);
}
</script>
</head>
<body background="../images/clearday.jpg" onLoad="StartSlideShow()">


<form name="SlideShow">
  <center>
    <table>
      <tr>
        <td colspan=2><img name="Screen" width=512 height=342></td>
    </tr>
      <tr>
        <td colspan="2" id="desc"></td>
      <tr>
        <td><input type="button" name="Previous" 
value=" << "
onClick="ShowSlide(-1)"></td>
       <td align="right"><input type="button" name="Next"
value=" >> " onClick="ShowSlide(1)"></td>
    </table>
  </center>
</form>
</body>
</html>

Dovrebbe funzinare.
Attenzione copia tutto ho modificato anche il body, per modificare le descrizioni alla riga
----------------------------------------------------------------------------------
var desc new array('qui descrizione foto 1','qui descrizone foto 2')
----------------------------------------------------------------------------------
rispettando la cronologia delle foto.

P.S. per la prossima volta non utilizzare pvt per aiuti grazie

Discussione: slideshow immagini con descrizione

Strumenti discussione

Ricerca discussione

Visualizza

slideshow immagini con descrizione

Permessi di invio