Newsgroup: it.comp.www.html
Titolo: Come troncare un'immagine?

Ciao a tutti!
Dovrei costruire dinamicamente un disegno composto da diverse immagini.
Il disegno rappresenta una porzione (1 mt) di una struttura formata da 
elementi dello stesso tipo.
In base alla scelta dell'utente il numero degli elementi è variabile.
Se quindi l'utente indica di voler 5 elementi per metro, allora lo script 
lato server mi costruisce il codice in questo modo:
<!-- sulla pagina   -->
<table border=0 cellspacing=0 cellpadding=0 width=250>
    <hr>
        <!-- 1° elemento -->
        <td width=50 align=center><img src="ElementoTipo1.jpg"></td>
        <!-- 2° elemento -->
        <td width=50 align=center><img src="ElementoTipo1.jpg"></td>
        <!-- 3° elemento -->
        <td width=50 align=center><img src="ElementoTipo1.jpg"></td>
        <!-- 4° elemento -->
        <td width=50 align=center><img src="ElementoTipo1.jpg"></td>
        <!-- 5° elemento -->
        <td width=50 align=center><img src="ElementoTipo1.jpg"></td>
    </hr>
</table>
Il problema sorge quando l'utente sceglie un valore con decimali, p.e. 4,5 
elementi per metro.
Inizialmente ho pensato di restringere la cella in cui è contenuto il 
'mezzo' elemento, però la cella si allarga per farci stare tutta l'immagine.
Quindi ho  pensato di usare il valore width del tag IMG senza pensare però 
che in questo modo l'immagine viene compressa.
Qualcuno sa dirmi come fare per ottenere l'effetto da me desiderato?
Grazie!
-- 
3st3b4n
www.seber.it
Questo post è stato scritto con bit riciclati 

 elementi dello stesso tipo.
Io cambierei totalmente approccio.
Anziché mettere una tabella con tante celle perché non un unico div con 
l'immagine replicata di sfondo?
<div id="struttura"></div>
<style>
#struttura {
    heigth: 100px;
    width: 450px;
    background: url(ElementoTipo1.jpg)
}
</style>
Visto che avrai a disposizione un linguaggio server-side, non dovresti aver 
problemi a scrivere dinamicamente quel che io ho messo come 450px 
calcolandolo in pixel come <valore immesso dall'utente> x <larghezza 
immagine>.
Se invece vuoi proprio proprio usare la tua tecnica, mi viene in mente di 
disegnare SOPRA la tua immagine ElementoTipo1.jpg e nella stessa cella, 
allineata a destra, un'immagine di 1px x 1px bianco e tirarla alla larghezza 
che vuoi con gli attributi width e height di <img>.
Preferisco comunque la prima soluzione se non hai nulla in contrario.
Nello. 

 <img>.
Avevo pensato già ad una soluzione di questo tipo:
impostare le immagini come sfondo delle celle (a questo punto alternate da 
celle vuote che mi permettano di modificare la distanza tra le celle con le 
immagini) e nell'ultima cella con sfondo inserire un'immagine bianca da 
allargare in base alla porzione di immagine da coprire.
Il problema però è che non so a priori quanto è larga l'immagine 
dell'elemento e quindi non posso nè calcolare quanto larghe fare le celle 
che contengono le immagini come sfondo, nè quanto fare larghe le celle vuote 
che mi creino la corretta distanza tra le celle che rappresentano gli 
elementi.
Altra idea?


 gli elementi.
Uhm, questo è un problema. Nel tuo post iniziale avevi scritto 
ElementoTipo1.jpg, credevo fosse un'immagine fissa e sempre uguale. A questo 
punto penso tu debba calcolarne la larghezza lato server (stai usando PHP)?
Ma... curiosità: stai creando un software per progettare arredamenti 
(cucine, soggiorni) via Web?
Comunque, ritornando all'idea della tabella con immagini di sfondo.
<table cellspacing="0">
<tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td class="last">&nbsp;</td>
</tr>
</table>
<style>
td {
    width: 50px; /* larghezza della cella */
    height: 100px; /* altezza dell'immagine */
    background: url(img/elemento.jpg) no-repeat 10px 0; /* il 10px è meta' 
dello spazio che vorresti mettere tra gli elementi */
}
td.last {
    width: 30px; /* ultima cella, larghezza minore delle altre */
}
</style>
E' un'idea che NON ho provato, non avendo a disposizione le immagini. Se 
comunque hai già messo su qualcusa su web che possiamo vedere, tanto meglio.
Nello.
</style> 

 tanto meglio.
Se volete vedere il programma ancora in versione beta, lo trovate qui (così 
lo testate pure):
http://www.aldolarcher.com/tools/calcolobalaustre/CalcoloBalaustre.asp
(il disegno viene creato di volta in volta quando vengono selezionate le 
varie parti della balaustra).
Grazie per l'interessamento.


 p.e. 4,5 elementi per metro.
Ho trovato il modo, se dovesse servire a qualcun'altro:
Se ho 4,5 elementi, creo la tabella con 5 colonne (ottenuto arrotondando 4.5 
in eccesso alla cifra intera) di larghezza pari a 250px / 4.5 (= 56px ).
In questo modo ottengo una tabella con larghezza totale pari a 280px (56px * 
5).
Questa tabella però è all'interno di una cella con larghezza pari a 250px di 
una tabella con style="table-layout: fixed;".
In questo modo ottengo un disegno di 4 elementi e mezzo.
