Nella pagina della mia soluzione ci sono due errori.
Il primo è:
<div id="image"
style="text-align: center; margin-top: 0px; height: 0px;">
la parte rossa non so come ci sia capitata e va tolta, deve rimanere
<div id="image">
e poi scusa ribadisco (sarà l'età) di non vedere tra <head> e </head> la regola css del div image
#image {
width: 600px;
height: 400px;
margin-right: auto;
margin-left: auto;
}
Piccolo consiglio non aggiungere niente alla tua pagina (correggere è spesso più difficile che creare) ma apri un nuovo documento nella vista sorgente cancella tutto e incolla pari pari questo:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="shortcut icon"
href="http://fotografandolanatura.net/petti.ico">
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>FOTOGRAFANDOLANATURA.NET</title>
<style type="text/css">
<!--
a:link {text-decoration: none}
a:visited {text-decoration: none}
a:hover {color: #999999}
-->
</style>
<style type="text/css">
ul.ppt {
position: relative;
}
.ppt li {
list-style-type: none;
position: absolute;
top: 0;
left: 0;
}
.ppt img {
padding: 5px;
}
#image {
width: 600px;
height: 400px;
margin-right: auto;
margin-left: auto;
}
</style>
</head>
<body
style="height: 739px; color: rgb(255, 255, 204); background-color: white; background-image: url(sfondi/grigio0069.jpg);"
alink="#ffffcc" link="#ffffcc" vlink="#ffffcc">
<div style="text-align: center;"><a href="#">prova</a></div>
<table
style="width: 900px; height: 680px; text-align: left; margin-left: auto; margin-right: auto;"
cellspacing="0">
<tbody>
<tr>
<td
style="border-style: ridge ridge none; border-color: rgb(255, 255, 204); border-width: 5px; height: 80px; text-align: left; vertical-align: bottom; width: 900px;"><span
style="font-family: Comic Sans MS;"><span
style="color: rgb(255, 255, 204);"><small
style="color: rgb(255, 255, 51);"><big><br>
</big></small><font size="+2"><span
style="color: rgb(255, 255, 51);"><a href="homepage.html"
target="_blank"> </a><a
href="homepage.html" target="_blank"> </a><br>
<a href="homepage.html" target="_blank">
Fotografando
la Natura...</a></span></font><br>
</span></span><span
style="font-family: Comic Sans MS;"><span
style="color: rgb(255, 255, 204);"></span></span><span
style="font-family: Comic Sans MS;"><span
style="color: rgb(255, 255, 204);"></span></span><span
style="font-family: Comic Sans MS;"><span
style="color: rgb(255, 255, 204);"></span></span><span
style="font-family: Comic Sans MS;"><span
style="color: rgb(255, 255, 204);"></span></span></td>
</tr>
<tr>
<td
style="border-style: none ridge ridge; border-color: rgb(255, 255, 204); border-width: 0px 5px 5px; text-align: center; height: 565px; vertical-align: top; width: 900px;">
<div style="text-align: center; margin-top: 0px; height: 0px;">
<br>
</div>
<div id="image">
<ul class="ppt">
<li><a href="#"><img
src="fotos/img007.jpg" alt="Foto1"></a></li>
<li><a href="#"><img
src="fotos/img002.jpg" alt="Foto2"></a></li>
</ul>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$('.ppt li:gt(0)').hide();
$('.ppt li:last').addClass('last');
var cur = $('.ppt li:first');
function animate() {
cur.fadeOut( 3000 );
if ( cur.attr('class') == 'last' )
cur = $('.ppt li:first');
else
cur = cur.next();
cur.fadeIn( 3000 );
}
$(function() {
setInterval( "animate()", 5000 );
} ); </script></div>
<br>
<big><big><small><span
style="font-family: Comic Sans MS;">
2005 © Fenicotteri</span></small></big></big><span
style="font-style: italic; font-family: Comic Sans MS;">
(Phoenicopterus ruber)</span><big><big><small><span
style="font-family: Comic Sans MS;"> al "decollo"</span></small></big></big>
</td>
</tr>
</tbody>
</table>
<div style="text-align: center;">
<table
style="width: 850px; height: 40px; text-align: left; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td
style="height: 40px; text-align: center; vertical-align: bottom; width: 850px;"><span
style="color: rgb(255, 255, 51); font-family: Comic Sans MS;"><br>
<big style="font-weight: bold;"><big>Fotografie
Naturalistiche di Animali, Paesaggi</big> <big
style="font-weight: bold;">e Natura in genere</big></big><br>
<big style="font-weight: bold;"><big>Nature
& Wildlife Photography of Animals and Landscapes</big></big><br>
<br>
</span>
<hr style="color: rgb(255, 255, 51); height: 1px; width: 50%;"
noshade="noshade"><span
style="color: rgb(255, 255, 51); font-family: Comic Sans MS;">1997-2010
© OrsoTibetano --- 2009-2010 ©
www.fotografandolanatura.net</span>
<div class="stats" style="display: none;"><!-- Inizio Codice Shinystat -->
<script type="text/javascript" language="JavaScript"
src="http://codice.shinystat.com/cgi-bin/getcod.cgi?USER=vandercric"></script>
<noscript><a href="http://www.shinystat.com/it"
target="_top">
<img
src="http://www.shinystat.com/cgi-bin/shinystat.cgi?USER=vandercric"
alt="Statistiche" border="0"></a>
</noscript>
<!-- Fine Codice Shinystat -->
</div>
</td>
</tr>
</tbody>
</table>
<span style="color: rgb(255, 255, 51); font-family: Comic Sans MS;"></span></div>
</body>
</html>
provato e riprovato funziona perfettamente. (ti ho anche aumentato i tempi di dissolvenza).
Per quanto concerne le didascalie sotto le foto devi necessariamente inserirle con un programma grafico nelle foto stesse, altrimenti bisogna ricorrere ad un altro tipo di slide ma le cose si complicherebbero. Ad ogni buon conto comincia a fare funzionare questo e, se proprio non ti sta bene, potremmo ricorrere ad altra soluzione.
Ciao