Как сделать так, чтобы ширина документа менялось в реальном времени, а не после загрузки?

Question

[Сергей Зверев]

Как сделать так, чтобы ширина документа менялось в реальном времени, а не после загрузки?

var width = q.width = $(document).width();

Answer 1

[Басим Аль-Джевахири]

Точно, или короткий вариант

$(window).resize(function () {
      var newWidth =  $(window).width();
      var newHeight = $(window).height(),
});

И в отличии от использования $(document), $(window).height() вернет высоту видимой части документа, а $(document).height() вернет высоту всего документа, и видимую и скрывающуюся под скролом.
например данная страница

$(window).height(); // вернет 638
$(document).height(); // вернет 4575

Comments

[Сергей Зверев]

Вот так у меня работает:

var width = 0;
	var height = 0;
	$(window).on('load resize', function() {
		width = q.width = $(document).width();
		height = q.height = $(document).height();
	});
	console.log('Ш: ' + width);
	console.log('В: ' + height);

А так не хочет работать:

var width = 0;
	var height = 0;
	$(window).on('load resize', function() {
		width = q.width = $(document).width();
		height = q.height = $(document).height();
	});
	console.log('Ш: ' + width);
	console.log('В: ' + height);

Если я сделаю размер под окно, то ниже скроллинга отображаться не будет при прокрутки. А мне нужно чтобы весь документ обхватывал.