JQuery DIV полная высота тела документа ДИНАМИЧНО - PullRequest
1 голос
/ 05 июля 2011

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

Мой код не очень сложен - я создаю DIV нана лету, связав с ним идентификатор, присвоив ему высоту и добавив элемент DOM:

S = document.createElement('div'); S.setAttribute('id','viewbg'); var pageHeight = getVpHeight(); $('#viewbg').css('height', pageHeight + 'px'); document.getElementsByTagName('body')[0].appendChild(S);

Когда я ставлю предупреждение (pageHeight) после вызова функции getVpHeight, он имеет правильную высоту (полная высота документа, а не только размер окна), но div ВСЕГДА по умолчанию использует исходные стили CSS, определенные в таблице стилей, игнорируя любое новое число.

Я пытался изменить высоту послеDOM создан, но он делает то же самое.Я также попробовал функцию jQuery (окно) .resize, и она ничего не сделала.

Я что-то упустил?Есть ли мастер jQuery / CSS, который может определить, что происходит?

Ответы [ 2 ]

1 голос
/ 05 июля 2011

Проблема в том, что вы вызываете метод css () для пустого селектора (элемент, который вы выбираете, еще не существует в DOM.

Вы можете сделать:

var pageHeight = $(window).height();
 S = $('<div>', {id:'viewbg',height: pageHeight} );
$('body').append(S);

скрипка http://jsfiddle.net/urWJS/

0 голосов
/ 05 июля 2011

Возможно, проблема в том, что ваша таблица стилей переопределяет добавляемые вами стили.

Вы пробовали:

 $('#viewbg').css('height', pageHeight + 'px !important');

UPDATE

Как отметил Никола, вы пытаетесь извлечь элемент со страницы, который еще не был вставлен, и, следовательно, вы не можете оформить его так, как вам хотелось бы.

В дополнение к ответу Никола я также укажу, что вы можете стилизовать элемент, используя jQuery, чтобы выбрать его из переменной, в которой он существует, следующим образом:

$(S).css('height', pageHeight + 'px'); 

Полный источник:

S = document.createElement('div');
S.setAttribute('id','viewbg');
var pageHeight = $(window).height();
$(S).css('height', pageHeight + 'px');
$('body').append(S);

ОБНОВЛЕНИЕ 2

Чтобы получить высоту документа, а не высоту окна, вы можете использовать:

var pageHeight = $(document).height();

http://jsfiddle.net/urWJS/2/

...