Description: Responsive view zoom transform scale. This make blank space. Need fix view full
Explain code: Original is 980, <980 auto scale. When scale important: '.container' is scale + absolute. Absolute is will make html>body auto height again.
Solution:
HTML
<body>
<div class="container">
CONTENT
</div>
</body>
SCRIPT
var jquery = jQuery.noConflict();
jquery(window).ready(function(){
/*ScallFullScreen*/
ZoomScale();
});
jquery( window ).resize(function() {
/*ScallFullScreen*/
ZoomScale();
});
/*ScallFullScreen*/
function ZoomScale(){
var widthScreen = jquery(window).width();
var scale = 1;
var wrapper = jquery('.container');
if(widthScreen<980){
/*scale=1*/
scale = widthScreen/980;
jquery(wrapper).css('position','absolute');
jquery(wrapper).css('width','980px');
jquery(wrapper).css('overflow-x','hidden');
}else{
jquery(wrapper).css('position','relative');
jquery(wrapper).css('width','auto');
jquery(wrapper).css('overflow-x','auto');
}
jquery(wrapper).css('-webkit-transform', 'scale(' + scale + ')');
jquery(wrapper).css('transform', 'scale(' + scale + ')');
jquery(wrapper).css('transform-origin', 'left top');
}
