How do I make the page auto resize when they shrink the browser window or have a smaller resolution. to make the page get smaller with the smaller resolution.
2 answers
points
I'm using a combination of the jquery $(window).bind('resize', function() { }); and then adjusting the css depending on the value of window.innerWidth
function moveImg() {
var img = 0;
var small = false;
if(window.innerWidth < 590){
console.error('window too small');
small = true;
img = 0;
}
else if(window.innerWidth < 800){
img = 67;
}
else {
img = 57;
}
if(small){
$('.img').css("right", 0);
}else{
$('.img').css("left", img+"%");
}
};
var resizeTimer = null;
$(function() {
moveImg();
$(window).bind('resize', function() {
if (resizeTimer) clearTimeout(resizeTimer);
resizeTimer = setTimeout(moveImg, 100);
});
});
