javascript - Vertical centering and cropping image with jQuery -


i have gallery couple of images has size: 1600px × 1042px

i cut , centers images on site using styles in css:

.graphic-container img {margin-top: -22%; margin-bottom: -22%;} 

for screen resolution higher 1600px include jquery code site:

<script type="text/javascript">   $(document).ready(function(){       resizediv();    window.onresize = function(event) {       resizediv();   }    function resizediv() {       document.body.style.overflow = "hidden";       vpw = $(window).width();        vph = $(window).height();        $('#featured .csc-imagewrap img').css({'width': vpw + 'px'});   }  }); </script> 

but when under gallery more content, person viewing site don't see whole content, because right scroller disabled.

i know line document.body.style.overflow = "hidden"; made this, when disable line have 15px white line on right side of gallery (because images has higher height screen resolution).

does know how fix this?

try set

overvlow: hidden;

for wrapping div container via css , remove

document.body.style.overflow = "hidden"; 

from js.


Comments