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

1
point

Try this: http://www.alistapart.com/articles/switchymclayout/

Answered almost 7 years ago by Justin Ryan
aland 0
0
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);
  });
});
Answered almost 7 years ago by aland