Adattare immagini slideshow a riquadro predefinito

Walter A.

Nuovo Utente
25 Lug 2012
12
0
0
Buongiorno a tutti.
Ho creato il seguente colice:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type"
 content="text/html; charset=ISO-8859-1">
  <meta name="description" content="Studio Immobiliare">
  <meta name="keywords" content="keywords">
  <meta name="author" content="Walter Ambra">
  <link rel="stylesheet" type="text/css"
 href="style.css" media="screen">
  <title>Studio Immobiliare di Ambra Walter</title>
  <script language="JavaScript">
var rotate_delay = 2000;
current = 0;
function next() {
if (document.slideform.slide[current+1]) {
document.images.show.src = document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex = ++current;
}
else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex = --current;
}
else last();
}
function first() {
current = 0;
document.images.show.src = document.slideform.slide[0].value;
document.slideform.slide.selectedIndex = 0;
}
function last() {
current = document.slideform.slide.length-1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop";
rotate();
}
function change() {
current = document.slideform.slide.selectedIndex;
document.images.show.src = document.slideform.slide[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {
current = (current == document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout("rotate()", rotate_delay);
}
}
// End -->
  </script>
</head>
<body>
<div class="container">
<div class="main">
<div class="content"><span style="font-weight: bold;"></span>&nbsp;
<br>
<form name="slideform">
  <table bgcolor="#0000ff" cellpadding="4"
 cellspacing="1">
    <tbody>
      <tr style="color: rgb(255, 255, 255);">
        <td style="background-color: rgb(0, 0, 255);"
 align="center" bgcolor="white"> <b>Galleria
fotografica della soluzione proposta</b> </td>
      </tr>
      <tr>
        <td align="center" bgcolor="white" height="150"
 width="200"> <img
 src="http://netcafe7.com/wp-content/uploads/2012/06/google.gif"
 name="show"></td>
      </tr>
      <tr>
        <td align="center" bgcolor="#0000ff">
        <select name="slide" onchange="change();">
        <option
 value="http://netcafe7.com/wp-content/uploads/2012/06/google.gif"
 selected="selected">Logo di Google </option>
        <option
 value="http://www.essenzialeonline.it/wp-content/uploads/2012/07/yahoo_logo1.jpg">Logo
di Yahoo </option>
        <option
 value="http://www.nationalpositions.com/blog/wp-content/uploads/2012/05/bing1.jpg">Logo
di Bing </option>
        </select>
        </td>
      </tr>
      <tr>
        <td align="center" bgcolor="#0000ff"> <input
 onclick="first();" value="|&lt;&lt;" title="Beginning"
 type="button"><input onclick="previous();"
 value="&lt;&lt;" title="Previous" type="button"><input
 name="slidebutton" onclick="ap(this.value);"
 value="Start" title="AutoPlay" type="button"><input
 onclick="next();" value="&gt;&gt;" title="Next"
 type="button"><input onclick="last();" value="&gt;&gt;|"
 title="End" type="button"></td>
      </tr>
    </tbody>
  </table>
</form>
<br>
<br>
<br>
</div>
</div>
</div>
</body>
</html>

La domanda è la seguente: come potrete notare, man mano che scorro le foto la cornice si ingrandisce e rimpicciolisce in funzione delle dimensioni delle foto. Io invece vorrei che le foto si adattassero proporzionalmente alle dimensioni di un riquadro standard di 530x375 pixel.
Come posso modificare dunque il mio script?
Grazie a tutti.
 
Ultima modifica di un moderatore:

Discussioni simili