У меня есть несколько сценариев, которые изменяют мое веб-приложение.Что он делает в основном:
- Добавление динамических элементов в DOM
- Изменение размера некоторых элементов DOM в соответствии с высотой окна и других элементов ...
Итак, я делаю:
$(document).ready ->
$('.interval-view').wrapInner '<div class="column" />'
$('.column').wrapInner '<div class="inner-column" />'
$('#contents, #footers').append '<div class="clearfix"></div>'
$('.interval-view:even').css 'background-color', '#F9F9F9'
$('.interval-view:odd').css 'background-color', '#DDD'
resize = ->
$('.column').height $(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true)
$('#timeline-panel').width $(window).width()
$('#timeline-panel .scrollable-area').width "#{$('.interval-view').length * $('.interval-view').width()}px"
window.onorientationchange = ->
resize()
$(window).resize ->
resize()
resize()
Но я не получаю правильное значение высоты на $('.column').height
.Скрипт возвращает мне значение высоты, как будто я не добавил элемент clearfix
.Как будто он не учитывает эту часть, когда вычисляет окончательную высоту.
Я даже пробовал с отложенным объектом, но безуспешно.Он по-прежнему принимает высоту без учета clearfix
элемента.
Для людей, не являющихся CoffeeScript, здесь я вставляю сгенерированный Javascript:
$(document).ready(function() {
var resize;
$('.interval-view').wrapInner('<div class="column" />');
$('.column').wrapInner('<div class="inner-column" />');
$('#contents, #footers').append('<div class="clearfix"></div>');
$('.interval-view:even').css('background-color', '#F9F9F9');
$('.interval-view:odd').css('background-color', '#DDD');
resize = function() {
$('.column').height($(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true));
$('#timeline-panel').width($(window).width());
return $('#timeline-panel .scrollable-area').width("" + ($('.interval-view').length * $('.interval-view').width()) + "px");
};
window.onorientationchange = function() {
return resize();
};
$(window).resize(function() {
return resize();
});
return resize();
});
Любой способ исправить это?