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; }
Comments
Post a Comment