jquery почему когда делаем resize для $(document).width(); ширина может только увелич

[sharomet]

А уменьшаться не может

var bgW;
var bgH;
$(window).resize(function() { 
initResize(); 
}); 
initResize(); 

function initResize(){ 
bgW=$(document).width(); 
bgH=$(document).height(); 
console.log(bgW); 
}

В итоге я могу растягивать экран ширина $(document).width(); будет увеличиваться а когда начну сужать то она остаёться той до которой я её увеличел, почему так происходит?

[tsigel]

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
Ширина <input id="width" type="text" /><br>
Высота <input id="height" type="text" />

<script>
$(window).resize(function() {
  initResize();
});

function initResize() {
  $('#width').val($(window).width());
  $('#height').val($(window).height());
}
</script>

[sharomet]

Дело в том что ширина окна мне не подходит.. Мне нужна ширина документа, так как ширина окна она не стабильная и если её привязывать к чему то при адаптивном дизайне она скачет происходят какие то перепады непонятные.
а если взять

$("body").width()+16;
$("body").width()+24;

получается полная ширина документа и причём стабильная, но я не знаю правильно ли это?