2013-03-15 11 views
-2

Итак, я пытаюсь получить элемент, который должен быть полной высотой страницы. Мой элемент html соответствует размеру страниц, даже когда я изменяю размер или открываю окно элемента проверки и закрываю его, но мое тело и другие элементы не будут, поэтому вместо этого я использую javascript, чтобы сделать мой элемент размером с полем html, который работает, но когда вы изменяете размер окна браузера или закрываете/открываете инструменты разработчика, элемент html изменяет размер, а другой элемент - нет.Совпадение высоты другого элемента при изменении размера

Есть ли способ добавить слушателя в мой элемент html для запуска функции при изменении высоты?

Вот код, который я попытался с помощью того, что кто-то предложил, но не работает:

$('#program-cell').height($('html').height()); 
$('html').resize(function() { 
    $('#program-cell').height($('html').height()); 
}); 

После добавления плагина .resize() один из ответов предложил я был в состоянии получить его почти работает , При открытии и закрытии инструментов разработчика он работает, но изменение размера окна ничего не меняет. Я предполагаю, что, поскольку я сопоставляю размер элемента html, элемент html будет расти, но чтобы соответствовать размеру объекта, который я изменяю, что означает, что он будет только больше и не меньше.

Мне нужно было очистить высоту объекта, который я изменяю, установив его высоту в auto, а затем сравните высоту html. Я, наконец, получил это работает, а вот код, который работает:

$('#program-cell').height(($('html').height()-84)+'px'); 
$('html').resize(function() { 
    $('#program-cell').height('auto'); 
    $('#program-cell').height(($('html').height()-84)+'px'); 
}); 

Я имею -84 вычесть высоту моего заголовка.

+4

некоторые код пожалуйста ......... – supersaiyan

+2

[.resize()] (http://api.jquery.com/resize/). – Vucko

+0

Я пробовал .resize, но, возможно, он работает только в окне? не для элементов? – Samir

ответ

2

Существует плагин для добавления слушателей для изменения размера элемента, который вы можете использовать для этого. Проверьте это here.

В качестве альтернативы, .resize() работает на окне.

+0

Nice плагин. Он не заботится о размере окна, но он заботится об открытии и закрытии окна инструментов разработчика. – Samir

+0

Можете ли вы использовать его для вызова '.resize()' на свой родительский элемент, который меняет размер с помощью div, а затем помещает javascript/jQuery внутри функции в размер? Что-то вроде '(change_div) .resize (function_to_do_some_resizing)' – ckersch

+0

Хорошо, я получил это, используя это. Проблема заключалась в том, что высота html менялась по высоте объекта, который я редактирую, поэтому мне пришлось снова сделать его маленьким, чтобы получить высоту html. Трудно объяснить, я напишу свой код в своем вопросе. – Samir

2

Вам не нужен JavaScript.

html, body { height:100%; } 
div { height:100%; } 
<html> <!-- 100% of window height --> 
    <body> <!-- 100% of html height --> 
     <div></div> <!-- 100% of body height --> 
    </body> 
</html> 

JSFiddle example.

Если ваш родитель вашего разделителя имеет значение, не превышающее 100%, ваш делитель не будет иметь 100% высоты относительно тела страницы.

<html> <!-- 100% of window height --> 
    <body> <!-- 100% of html height --> 
     <div style="height:30px"> <!-- 30px high parent --> 
      <div></div> <!-- 100% of parent height = 30px --> 
     </div> 
    </body> 
</html> 
+0

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

+0

Я привел пример, чтобы доказать, что это работает. Вниз голосующий мой ответ, потому что вы не готовы потратить некоторое время на решение своей проблемы, это тоже довольно слабое дело. Ваш вложенный делитель с высотой 100% будет иметь высоту 100% от родителя. Например, если ваш родитель с разделителем высоты 100% имеет высоту 30 пикселей, ваш разделитель высоты 100% будет только на 30 пикселей. –

+0

Downvoting? Я ничего не голосовал ... Я тот, кто задает вопрос здесь, я все уши для любого потенциального решения! – Samir

Смежные вопросы