Immagine capovolta - solo nel browser

Quando visualizzo le proprietà dell'immagine (vedere di seguito) sul mio computer Windows, si dice chiaramente width:144 e height:256. Ma quando lo guardi nel browser le dimensioni sono capovolte.Immagine capovolta - solo nel browser

esempio di esso capovolto nel browser: http://jsfiddle.net/pLyg7ug9/2/

Link diretto (si noti che si carichi correttamente in cromo): http://pro-cuts.herokuapp.com/images/slideshow/thumb/8_flipped.jpg

Che cosa potrebbe causare il browser per capovolgere la larghezza e l'altezza?

fonte

2015-03-04 Justin Bicknell

Ciò è dovuto alla rotazione JPEG e all'orientamento EXIF. Fondamentalmente la tua fotocamera ha un sensore che ruota l'immagine a seconda di come la prendi. I telefoni con orientamento bloccato avranno questi problemi.

JPEG Exif Data

fonte

2015-03-04 06:04:23

Grazie per le informazioni, non avevo idea che esisteva. Sai in qualche modo che questo potrebbe essere risolto da CSS, per forzare il browser a rispettare l'altezza/larghezza? –

Vedo che questo esiste, ma sfortunatamente solo in firefox http://caniuse.com/#feat=css-image-orientation –

@JustinBicknell Potresti avere un sacco di controlli per cambiare la rotazione a seconda del browser. Ma la soluzione migliore sarebbe quella di correggere il punto in cui inizia il problema, l'immagine stessa. Puoi semplicemente aprirlo in un programma di modifica delle immagini, ruotarlo se necessario e salvarlo di nuovo. O scattare le foto con la rotazione corretta (abilitare la rotazione quando si scatta la foto). –

Immagine capovolta - solo nel browser

risposta

Problemi correlati