Ho un piccolo problema...
In una tabella ho una immagine con width e height al 100%. Questa immagine è oggetto di un semplice javascript che ne cambia il SRC (quindi io non so a priori qualìè l'immagine, perché cambia.)
Ovviamente se l'immagine è più alta che larga si deforma in larghezza.
Se invece l'immagine è più larga che alta si deforma in altezza.
Esiste un modo per non farla deformare, ma ingrandirla mantenendo i rapporti di larghezza e altezza?
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
up
(PS. Mi avete spostato in JavaScript, perché già sapete che non esiste una proprietà HTML che consenta di tenere fisse le proporzioni di una immagine?)
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
e io riuppo!
Cmq una mezza idea con JS ce l'ho... (ora provo se ci riesco vi faccio sapere...)
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
Dato che l'immagine e' all'interno di una cella di tabella... prova fissare la larghezza della cella ed imposta la sola larghezza dell'immagine al 100% ... magari funziona
ciao
Il guaio per i poveri computers e' che sono gli uomini a comandarli.
Attenzione ai titoli delle discussioni: (ri)leggete il regolamento
Consultate la discussione in rilievo: script / discussioni utili
Usate la funzione di Ricerca del Forum
Uhm... grazie. L'idea è buona, la risposta corretta, ma non risolve il mio problema!
Infatti è un po' diverso da come l'avevo semplificato...
In realtà io ho una tabella con la cella di una precisa dimensione, tipo 320x200.
Al suo interno metterò immagini di varie dimensioni: ora vorrei che le immagini, mantenendo le proprie proporzioni sfruttassero tutto lo spazio disponibile della cella.
Secondo te si può fare? Altrimenti dovrei ricorrere a javascript, inserendo oltre al nome dell'immagine i suoi width e height... oppure col PHP...
Metodi complicati li trovo per risolvere
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
ciaocodice:[img]LaTuaFoto.jpg[/img]320){h=h*320/w; w=320}; if(h>200){w=w*200/h; h=200}; this.width=w; this.height=h;">
Il guaio per i poveri computers e' che sono gli uomini a comandarli.
Attenzione ai titoli delle discussioni: (ri)leggete il regolamento
Consultate la discussione in rilievo: script / discussioni utili
Usate la funzione di Ricerca del Forum
Innanzitutto grazie per l'impegno nell'aiutarmi!
Funziona, ma solo con l'immagine caricata con l'onload e non con quelle caricate dinamicamente.
Infatti scrivendo:
Le due righe incriminate, non caricano l'effettiva width e height dell'immagine, ma quelle della prima immagine caricata, cioé di "foto01.jpg" correttamente rimpicciolita...Codice PHP:<HTML>
<BODY>
<TABLE width=300 height=200 align=center border=1 cellspacing=0 cellpadding=0><TR><TD>
[img]img/foto01.jpg[/img]320){h=h*320/w; w=320}; if(h>200){w=w*200/h; h=200}; this.width=w; this.height=h;">
</TD></TR>
</TABLE>
<CENTER>
[url="javascript:goon(galleria,'foto01.jpg');"]Foto 01[/url] -
[url="javascript:goon(galleria,'foto02.jpg');"]Foto 02[/url] -
[url="javascript:goon(galleria,'foto03.jpg');"]Foto 03[/url] -
[url="javascript:goon(galleria,'foto04.jpg');"]Foto 04[/url] -
[url="javascript:goon(galleria,'foto05.jpg');"]Foto 05[/url] -
[url="javascript:goon(galleria,'foto06.jpg');"]Foto 06[/url] -
[url="javascript:goon(galleria,'foto07.jpg');"]Foto 07[/url] -
[url="javascript:goon(galleria,'foto08.jpg');"]Foto 08[/url]
</CENTER>
<SCRIPT LANGUAGE="JavaScript1.2">
function goon(chi, src) {
chi.src="img/"+src;
w=chi.width; // Righe incriminate
h=chi.height; // Righe incriminate
if(w>320) {h=h*320/w; w=320};
if(h>200){w=w*200/h; h=200};
chi.width=w;
chi.height=h;
}
</SCRIPT>
</BODY>
</HTML>
Potrei passare per ogni immagine il suo width e height... ma vorrei evitare perché non sempre è noto a priori (in realtà questa pagina viene generata dal PHP). Con PHP (e le GD...) potrei ricavarli il width e l'height ma vorrei risolvere a livello di JS.
Esiste un metodo per "eliminare" le variabili width e height? Tipo unset(chi.width)... :master:
Funzionerebbe?
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
HO TROVATO!!!
L'unica è che c'è un fastidioso passaggio quando gli attributi vengono cancellati.Codice PHP:<HTML>
<BODY>
<TABLE width=300 height=200 align=center border=1 cellspacing=0 cellpadding=0><TR><TD>
[img]img/foto01.jpg[/img]320){h=h*320/w; w=320}; if(h>200){w=w*200/h; h=200}; this.width=w; this.height=h;">
</TD></TR>
</TABLE>
<CENTER>
[url="javascript:goon(galleria,'foto01.jpg');"]Foto 01[/url] -
[url="javascript:goon(galleria,'foto02.jpg');"]Foto 02[/url] -
[url="javascript:goon(galleria,'foto03.jpg');"]Foto 03[/url] -
[url="javascript:goon(galleria,'foto04.jpg');"]Foto 04[/url] -
[url="javascript:goon(galleria,'foto05.jpg');"]Foto 05[/url] -
[url="javascript:goon(galleria,'foto06.jpg');"]Foto 06[/url] -
[url="javascript:goon(galleria,'foto07.jpg');"]Foto 07[/url] -
[url="javascript:goon(galleria,'foto08.jpg');"]Foto 08[/url]
</CENTER>
<SCRIPT LANGUAGE="JavaScript1.2">
<!--//
function goon(chi, src) {
chi.clearAttributes(chi.width);
chi.clearAttributes(chi.height);
chi.src="img/"+src;
}
//-->
</SCRIPT>
</BODY>
</HTML>
Dovrei far scomparire l'immagine (un hidden) prima di cancellare gli attributi e farla ricomparire dopo aver caricato la nuova.
Ora come ora il codice non mi viene... (A me non serve! Carico una gif di 1 pxl trasparente prima...).
Se qualcuno lo conosce lo può aggiungere a questo topic in modo che qlk1 altro se lo ritrova...
Grazie br1!
Salvatore De Bonis AKA Novice of Ricotta AKA NashCrash
Permessi di invio
Rispondi quotando