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
Autore Titolo Forum Risposte Data
Juriy APP: Adattare immagini a GIF animata in real time Programmazione 0
felino [CSS][Wordpress] Adattare delle immagini alla dimesione del box contenitore HTML e CSS 2
R Adattare immagini alla dimensione del monitor Javascript 2
M [Javascript] Adattare immagine di background all'altezza dello smartphone Javascript 1
L [HTML] Adattare bordo al contenuto HTML e CSS 4
D [Javascript] Convertire ed adattare una data Javascript 1
B Adattare testo a cornice HTML e CSS 2
felino Adattare un layout desktop ad un responsive HTML e CSS 9
K Adattare app ad ogni schermo Sviluppo app per Android 1
L Adattare sfondo in base alla risoluzione WordPress 3
P Adattare sito alle varie risoluzioni... HTML e CSS 2
P Risoluzione del sito si può adattare? HTML e CSS 0
V Adattare sito web per tutte le risoluzioni ? HTML e CSS 1
P Adattare sito a diverse risoluzioni HTML e CSS 14
M Adattare script di "form mail con upload file" al mio form mail HTML! PHP 7
S Adattare la pagina web creata ad ogni monitor HTML e CSS 11
C Adattare uno script di altro linguaggio a javascript Javascript 11
matrobriva Adattare classe Odt2Xhtml PHP 2
F [HELP] Adattare al form Visual Basic 0
L Adattare il sito a qualsiasi computer Webdesign e Grafica 4
P Adattare un layer alle varie risoluzioni HTML e CSS 0
D Adattare contenuto a risoluzione utente HTML e CSS 5
G adattare sito con frame a monitor [era:Frame] Webdesign e Grafica 3
M Adattare iFrame HTML e CSS 5
B Adattare tabella a immagine di sfondo con Dreamweaver Cs3 Webdesign e Grafica 3
StefanoITA Adattare il sito alla risoluzione del visitatore HTML e CSS 5
M Adattare sito a risoluzione video [era:help me] HTML e CSS 6
G adattare pagina web a tutte le risoluzioni HTML e CSS 9
C Adattare un filmato a vari monitor Flash 5
C Adattare il sito a vari schrmi HTML e CSS 2
S [VB.NET]: Coordinate immagini dentro una PictureBox Visual Basic 0
G Perché il mio sito su Google news fa vedere le immagini degli articoli la mia foto profilo? WordPress 1
M Immagini non usate WordPress 0
elmonarca77 Utilizzo e licenze immagini Webdesign e Grafica 4
S Risoluzione Immagini e Connessione Joomla 0
G Il mio sito dopo aver abilitato l'ssl non visualizza le immagini con indirizzi senza ssl HTML e CSS 0
A WordPress e immagini Hosting 0
Y RITAGLIO IMMAGINI Javascript 0
R Immagini html HTML e CSS 2
E Come gestire al meglio le immagini legno grande formato Photoshop 0
M Random Immagini + Testi PHP 13
L form immagini per il database PHP 0
Ricky80 Coordinazione immagini HTML e CSS 4
P Percorsi e immagini. PHP 0
N Indicizzazione immagini su Google Google Search Console 0
L Import Immagini piattaforma IONIC Sviluppo app per Android 0
L Import massivo di immagini in tabelle piattaforma IONIC Presentati al Forum 1
P Script upload immagini jQuery 0
E Salvare immagini PHP 0
S problema salvataggio immagini Photoshop 0

Discussioni simili