JS, HTML, CSS. Если размер окна < 200px, то вывод
Записи нет
. Иначе будет выводиться записи из БД и увеличивать окно до 900px с прокруткойДоброго времени суток!
Подскажите пожалуйста, хочу сделать обработчик на высоту блока. У меня приложение с выводом из БД. Если записи не выведены, то размер окна минимальный и текст "Записей нет". Ежели БД заполнили и записи появились, то становится активное другое окно и показывает уже записи из БД.
В пример привожу кусочек когда где просто имитирую вывод из БД цифрами
Точно также если БД пуста, записи удалили, то обратно красный фон и надпись "Записей нет"
toggle();
window.onresize = function() {
toggle();
}
function toggle() {
if (window.innerHeight > 200) {
document.getElementById('largeElement').style.display = 'none';
document.getElementById('smallElement').style.display = 'block';
}
else {
document.getElementById('largeElement').style.display = 'block';
document.getElementById('smallElement').style.display = 'none';
}
}.largeElement{
width: 900px;
min-height: 200px;
max-height: 500px;
display:none;
background-color:blue;
overflow: scroll;
overflow-x: hidden;
}
.smallElement{
width: 900px;
/* display: none;*/
min-height: 200px;
max-height: 500px;
background-color: red;
}<div id="largeElement" class="largeElement">
<p>1</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>11</p>
<p>12</p>
<p>13</p>
<p>14</p>
<p>15</p>
<p>1</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>11</p>
<p>12</p>
<p>13</p>
<p>14</p>
<p>15</p>
</div>
<div id="smallElement" class="smallElement">
<p>Записей нет</p>
</div>Иначе говоря, когда я расскоментирую largeElement, то хочу увидеть синий фон с цифрами
Буду благодарен любой помощи!