2015-03-06 6 views
0

У меня есть сценарий, который помещается для камер на весь экран. Я сделал скрипт, который создает таблицу:Подходит для. Проблема с высотой

document.getElementById('cameras_content').innerHTML += 
    ('<table height="50%" width="50%" style="float: left;">' + 
     '<tr>' + 
      '<td><img id="topImage'+ m +'" width="100%" height="100%"></img></td>' + 
     '</tr>' +             
    '</table>');  

Как есть 4 камеры делилась на полном экране таблица является 2х2 У меня есть проблема с размером макияжа правильно. Горизонтально нормально, у меня есть два изображения, которые подходят. Проблемы вертикальны. Я сделал высоту точно так же, как и горизонтально, но она не работает. Есть ли какая-нибудь волшебная команда для этого?

Вот полный скрипт экрана:

function fullscreen(){ 
var elem = document.getElementById("cameras_content"); 
if (elem.requestFullscreen) { 
    elem.requestFullscreen(); 
} else if (elem.msRequestFullscreen) { 
    elem.msRequestFullscreen(); 
} else if (elem.mozRequestFullScreen) { 
    elem.mozRequestFullScreen(); 
} else if (elem.webkitRequestFullscreen) { 
    elem.webkitRequestFullscreen(); 
} 
}  

ответ

0

Для того, чтобы использовать проценты в высоте в HTML странице, вы должны изменить способ размеров страницы непосредственно. (Как правило, тело изменяет себя, чтобы вместить его содержание, а не заполнять окно браузера)

Чтобы сделать это, добавьте следующие строки внутри <head> тега:

<style type="text/css"> 
    html{ 
    height: 100%; 
    } 
    body { 
    min-height: 100%; 
    } 

    /* this part is optional, but makes scrollbars etc easier to handle */ 
    body, html{ 
    padding:0; 
    } 
</style> 

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

+0

не помогло. еще высота не подходит. Добавлен мой сценарий с полным экраном. – user3422998

+2

Запрос на полноэкранный режим - это нечто совершенно отличное от того, чтобы элемент был поместим по вертикали ... –

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