PDA

Visualizza versione completa : Dimensioni immagini per css div box



dRyW
17-10-12, 14: 15
Provate a caricare questa (http://www.ilcontadinobio.it/fiere_eventi.html) pagina

Sicuramente il riquadro in cui è contenuto il corpo della pagina impiegherà un eternità per caricare. Ebbene l'immagine è di circa 600kb.

Ho utilizzato il css:


Only registered members can view code.

dove 5.png è l'immagine che viene caricata come box anch'essa di width:1100px;height:600px;

Quello che mi interessa sapere è se è possibile realizzare l'immagine di dimenzioni minori e poi impostare dei parametri height width per allargarla con css in modo da accorciare considerevolmente i tempi di caricamento.

calaf
17-10-12, 15: 58
Non so cosa rispondere.
Il link proposto mi indirizza sulla pagina in un attimo.

dRyW
17-10-12, 16: 20
Sarà per via della tua connessione, per esempio con la mia la prima volta quindi prima di salvare qualsiasi informazione in ram cache etcetc ha impiegato qualche secondo prima di caricare l'immagine.

Asterix
17-10-12, 18: 35
Sinceramente non mi piace come soluzione anche perchè corri il rischio di sgranare la foto
Ora puoi provare con il ridurre la qualità ad esempio portarla a 72 dpi, alla fine la devi solo visualizzare e non stampare, mantenendo la dimensione della foto.

Comunque per adattare l'immagine al div puoi provare con la proprietà



risultato


Only registered members can view code.

Questo codice funziona con: IE9+ - FF4+ - SAFARI 5+ - CROME 3+ - OPERA 9.5+

:bai

dRyW
17-10-12, 19: 59
Perfetto, grazie!

Purtroppo è già tutto a 72dpi.

In effetti non è gran che..

Nessuna altra idea su come come alleggerire le dimenzioni in bit mantenendo inalterate quelle in px?

Asterix
17-10-12, 20: 04
Nessuna altra idea su come come alleggerire le dimenzioni in bit mantenendo inalterate quelle in px?

Hai provato con formati tipo gif o jpg

:bai

dRyW
17-10-12, 21: 00
Provo con gif, avendo gli angoli arotondati ho bisogno di trasparenza.

Ottimo, con gif si dimezza!

Ok questa l'abbiamo risolta in pieno.