Dimensione immagine con slideshow mootools

[mr.fifteen]

Buongiorno a tutti
Ho un problema con uno slideshow fatto in javascript.
Funziona perfettamente (http://www.maxiliftinternational.it/...ID_cantiere=12 ), ma l'immagine che si vede nel riquadro è troppo grande e dovrebbe essere contenuta all'interno (sia che sia orizzontale sia che sia verticale).
E' possibile farlo?

E un altra cosa: cliccando sull'immagine grossa vorrei che non apparisse la finestrelle js che mi dice il numero della foto, ma che la foto si ingrandisse con una lightbox (o al limite che facesse comparire l'alt se proprio l'ingrandimento non è possibile).

Non so assolutamente dove mettere le mani...

Posto un po' di codice, questo è quello della pagina:

        
<% If Not rs_foto.EOF Or Not rs_foto.BOF Then 'mostra se ci sono foto%>
  <div id="slideshowContainer" class="slideshowContainer"></div> 
  <div id="thumbnails">
    <% 
While ((Repeat1__numRows <> 0) AND (NOT rs_foto.EOF)) 
%>
      " class="slideshowThumbnail">[img]public/foto/<%=(rs_foto.Fields.Item([/img]" alt="<%=(rs_foto.Fields.Item("didascalia").Value)%>" width="25" border="0" />
      <% 
  Repeat1__index=Repeat1__index+1
  Repeat1__numRows=Repeat1__numRows-1
  rs_foto.MoveNext()
Wend
%>
  


Play | Stop | Prossima | Precedente</p></div>
<script type="text/javascript">
		  	window.addEvent('domready',function(){
				var obj = {
					wait: 3000, 
					effect: 'fade',
					duration: 1000, 
					loop: true, 
					thumbnails: true,
					backgroundSlider: true,
					onClick: function(i){alert(i)}
				}
				show = new SlideShow('slideshowContainer','slideshowThumbnail',obj);
				show.play();
			});
		      </script>      
<% End If ' end Not rs_foto.EOF Or NOT rs_foto.BOF %>

questi sono i css relativi:

#slideshowContainer {
	width: 260px;
	height: 260px;
	text-align: center;
	margin-top: 5px;
	margin-bottom: 5px;
	vertical-align: middle;
}
.loading {
	background-image: url(../img/ajax-loader.gif);
	background-repeat: no-repeat;
	background-position: center;
}
.slideshowThumbnail {
	outline: none;
}
.slideshowThumbnail img {
	border: 1px solid #FFFFFF;
	padding: 4px;
}
.current img {
	padding: 5px;
	border: 1px solid #FF0000;
}
.outline {
	border: 1px solid orange;
	position: absolute;
	z-index: 0;
}
#thumbnails {
	text-align: center;
	/*width: 130px;
	float: left;*/
}
a:hover.slideshowThumbnail img {
	padding: 4px;
	border: 1px solid #CCCCCC;
}

se occorre postare anche i file js mootools inclusi ditemelo.

Se siete in grado di risolvere anche solo uno dei miei problemi mi risolvete un problema enorme.

Grazie in anticipo.
Fede

[artorius]

allora, mettici come css:

#slideshowContainer img{
width: 260px;
}

e l'immagine dovrebbe essere ridimensionata (ti verrà tagliato un po' il sotto, ma è meglio che vederlo schiacciato)

Per la seconda domanda, non puoi attivare il lightbox tramite una funzione ajax, ma solo con un link (tag a) e lo slideshow di mootools non inserisce i link. Ho notato che usi una versione ridotta di mootools, inoltre è piuttosto vecchia, se usassi la 1.2 potre darti un consiglio, ma con questa non saprei. Puoi vedere se slideshow.js e backgroundSlider.js possono funzionare con mootools1.2?

[mr.fifteen]

controllo subito

[mr.fifteen]

non va... grazie cmq per il css e per la risposta...