ciao ragazzi,
questo il mio problema:
ho creato una pagina con un banner con immagini random ad ogni caricamento.
Fin qui nessun problema. Il problema sorge quando voglio dare una dimensione alle immagini. Infatti vorrei che le immagini fossero fluide, cioè si adattassero alla risoluzione dello schermo.
Prima di fare il banner a rotazione avevo una sola img alla quale avevo dato una dimensione di 100% nel css, e lei da brava si adattava se ridimensionavo la finestra.
Ora avendo fatto fuori l'immagine, rimpiazzandola col banner (che è un javascript collegato) come faccio a fare in modo che le immagini si adattino allo schermo?
Sto impazzendo per favore aiutatemi!
Ho provato ad aggiungere nel javascript un attributo size impostato al 100%, ma non funge .... perdonatemi non conosco il javascript.
Sicuramente per voi è una cavolata, ma io sto impazzendo da giorni.
questo il jscript:
var openInNewWin = true;
var banners = new Array();
banners[0] = new Banner("http://prova.it", "Banner 1", "banner1.jpg", "100%");
banners[1] = new Banner("http://prova.it", "Banner 2", "banner2.jpg", "100%");
banners[2] = new Banner("http://prova.it", "Banner 3", "banner3.jpg", "100%");
function Banner(url, description, image, size) {
this.url = url;
this.description = description;
this.image = image;
this.size = size;
return this;
}
var bNum = Math.round(Math.random() * (banners.length - 1));
document.write("<a href=\"" + banners[bNum].url + "\"");
if (openInNewWin) {
document.write(" target=\"_blank\"");
}
document.write(">");
document.write("<img src=\"" + banners[bNum].image + "\" border=\"0\" alt=\""
+ banners[bNum].description + "\"/>"); document.write("</a>");
nel foglio di stile ho:
#banner{
margin: 5px;
padding: 0 0 0 0;
width: auto;
height:112px;
background:white;
text-align:center;
}
nell'html ho:
<div id="banner">
<script language="javascript" src="banner.js">
<!--
//-->
</script>
</div>
Grazie,
Danielle
Rispondi quotando
