Ciao ragazzi
sto cercando di realizzare una galleria di immagini..
il problema è che devo visuallizarle tutto come se avessero la stessa dimensione, tutte della stessa grandezza , poi ovviamente quando si aprono sono della dimensione originale, quindi in poche parole ho delle immagini con dimensione diversa, e ho la necessita di visuallizarle nella pagina principale della galleria come se fossero tutte della stessa dimensione... mi potete aiutare?
grazieee
hai già preparato la galleria ?
di che dimensioni stiamo parlando ?
se sono superiori a 240px devi considerare di creare le miniature con un programma di grafica tipo gimp o photoshop (a seconda delle tue finanze e dei risultati che vuoi avere)
edit :
metti un link alla pagina che stai creando
Con il solo css puoi fare ben poco, a parte intervenire per forzare un'immagine a dimensioni prestabilite (usando le proprietà height e width), ottenendo però almeno tre sgradevoli effetti:
- l'immagine verrà deformata per adattarsi alla tua dimensione (niente rimpicciolimenti in scala o cose del genere)
- il rendering dell'immagine rimpicciolita dovrà essere fatto in locale dal motore del browser, con risultati non prevedibili
- i file originale di ogni immagine originale dovrà essere comunque scaricato tutto, con notevole spreco di tempo e banda, perché il ridimensionamento (come dicevo sopra) viene eseguito dal browser e non dal server. Si perde in questo modo il vantaggio intrinseco della gallery, ovvero la possibilità di vedere in fretta tante anteprime tra cui scegliere ciò che interessa.
Quello che ti serve, piuttosto, è un bello script php che ridimensioni le immagini. Ce ne sono parecchi in giro, praticamente ti permettono di settare vari parametri (altezza, larghezza, qualità, crop, ecc.) con i quali php genera dei file temporanei di anteprima con quelle caratteristiche.
È sufficiente richiamare lo script all'interno del ciclo in cui viene generata la galleria, ed il gioco è fatto
«Prendo rifugio nel grande BOH»
...
il problema è che prendo le img da facebook con i graph...
ho la necessita anche fosse con i jquery di visualizzare tutte le miniature in modo uguale...
continuo le ricerche ...
grazie comunque
Dovresti wrappare ogni thumb in un contenitore con position: relative, overflow: hidden e dimensioni fisse che vuoi tu, e la thumb al suo interno settarla con position: absolute e muoverla con le proprietà top e left in modo da centrarla senza però strecciarla usando width ed height, il problema è che così ogni volta dovresti calcolarti un sacco di cose, e qui si passa al javascript...
non c'è bisogno di cercare altroveOriginariamente inviato da mgfx
continuo le ricerche ...
i css servono anche a questo
ti abbiamo soltanto fatto notare come non sia il modo migliore specie se la galleria è "corposa"
ma se sei davvero convinto di seguire questa strada eccoti un'idea di codice
codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>galleria</title> <style> * { margin: 0; padding: 0; } ul { list-style-type: none; } li { margin: 10px; float: left; height: 100px; width: 200px; border: 1px solid black; overflow: hidden; position: relative; } a:link { text-align: center; height: 100px; width: 300px; position: absolute; left: 100px; top: 5px; margin-left: -150px; } img { height: 90px; } </style> </head> <body> <ul>[*][img]1.jpg[/img][*][img]2.jpg[/img][*][img]3.jpg[/img][/list] </body> </html>
grazie è una buona soluzione, solo che le immagini verticali a sinistra e a destra rimangono vuote...
ho girato mezzo web.. ma niente :|
Permessi di invio
Rispondi quotando