jquery - center large image inside container but keeping aspect ratio -


i'm trying replicate how slider image works on http://www.hmv.com. if shrink down screen size image if zooms out still keeps aspect ratio. understand when shrink screen down.

i have container 739px tall , 100% width wise.

i have created jsfiddle guys see me code is.

//this can add jsfiddle link

sizeheaderimg(); 

but when shrink screen down image doesnt keep nice scale. image size 1920 x 1000

i happy use plugin if there thing point me in right direction code going wrong appreciated

thanks

you don't need javascript achieve this:

img {     height: auto;     max-width: 100%; }  .hero-image {     height: 739px;     width: 100%;     overflow: hidden;     position: relative; }  .hero-image img {     position: absolute;     top: 0;     bottom: 0;     margin: auto; } 

http://jsfiddle.net/lwj2c/2/


Comments

Popular posts from this blog

java - Intellij Synchronizing output directories .. -

git - Initial Commit: "fatal: could not create leading directories of ..." -