Window.innerHeight конфликт с bootstrap

Я добавил бутстрап к существующей веб-странице. Веб-страница использует Javascript для определения размера содержимого, поэтомуWindow.innerHeight конфликт с bootstrap

var containerHeight = window.innerHeight - header - footer

используется несколько раз.

Поскольку я добавил бутстрап, высота <html> неверна (означает горизонтальную полосу прокрутки) после внутренней загрузки/обновления каждой страницы, где вызывается window.innerHeight. «Дополнительная» область - белая, и инструмент для отладки говорит мне, что это вне <body> и jsut часть области <html>.

Любое действие (изменение размера окна, фоновые события, действительно что-либо) сбрасывает высоту до 100%, а горизонтальная полоса прокрутки исчезает.

Как только я прокомментирую строку с window.innerHeight, проблема исчезнет. Просто ЗВОНИТЕ! строка вызывает проблему, даже если результирующее значение не применяется.

Это прекрасно работает:

//var containerHeight = window.innerHeight - header - footer 
//$('.someClass').css('height',containerHeight)

Это не

var containerHeight = window.innerHeight - header - footer 
//$('.someClass').css('height',containerHeight)

(То же самое относится и к $(window).height() BTW)

Как решить эту проблему без удаления начальной загрузки.

Кроме того, я достал файл bootstrap.js, чтобы проверить, есть ли какие-либо сценарии в конфликте.

Я переименовал переменные несколько раз, тоже посмотреть, если они будут какими-то образом быть в конфликте с любым бутстраповским набором переменными ...

Я проверял max-height=100%; и вещи одинаково, но он не работал меня.

Проблема возникает только в IE9, насколько я знаю. К сожалению, я должен использовать этот браузер, поскольку моя компания имеет его как стандартный браузер.

Я приобрел бутстраповские файлы с помощью диспетчера NuGet-пакет, так как я работаю с ASP.NET

Пожалуйста, дайте мне знать, если вам нужна дополнительная информация, я буду рад предоставить их.

источник

2015-09-29 print x div 0

Хорошо, я «грубой вынуждены» через bootstrap.css (закомментировать первую половину, проверил, а затем вторую половину и повторяется для оставшейся площади)

Как только я закомментировать эту часть:

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 
{ 
position: relative; 
min-height: 1px; 
padding-right: 15px; 
padding-left: 15px; 
}

Вопрос был решен.

Если кто-нибудь может объяснить это мне, я соглашусь на соответствующий ответ!

источник

2015-09-29 15:27:16

Window.innerHeight конфликт с bootstrap

ответ

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