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
A Semplice galleria immagini HTML e CSS 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 Webmaster Tools 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
R Immagini scontornate: che formato? HTML e CSS 4
A Sovrapposizione Immagini Photoshop 0
Cosina Mostrare immagini da una cartella, ma solo un numero definito PHP 12
Tommy03 Gestire dimensioni immagini PHP 4
M Aiuto con inserimento immagini WordPress 6
L Scmporre una foto dotata di varie immagini in piu layer Photoshop 2
M Impossibile visionare la immagini dall'App. IP Cam e Videosorveglianza 8
A Array di immagini Sviluppo app per Android 10
L Come spostare cartella immagini/video PHP 1

Discussioni simili