@nen0y

Как создать новый элемент по ресайзу окна?

Когда ширина окна становиться < 991px, то должен создастся тэг с классом .title, как это сделать?
  • Вопрос задан
  • 61 просмотр
Пригласить эксперта
Ответы на вопрос 2
Psixodelik
@Psixodelik
Преподаватель на Hexlet
Проще всего это решить без помощи JS. Вы можете создать блок, который изначально скрыт. Используя медиа-запросы при ширине < 991px давать ему новое значение свойства display.

<style>
  .hide {
    display: none;
  }

  @media screen and (max-width: 991px) {
    .show-md {
      display: block;
    }
  }
</style>

<div class="title hide show-md"></div>


Если нужен именно JS, то используйте matchMedia
Ответ написан
Tim-A-2020
@Tim-A-2020
Помог? Отметь решением
примерно так
let flag = true;
window.addEventListener('resize', ({ target }) => {
    if (flag && target.innerWidth < 991) {
        gettag();
        flag = false;
    } else if (!flag  && target.innerWidth > 991) {
        flag = true
    }
}, false);

function gettag() {
    let tag = document.createElement('div');
    tag.className = 'title';
    //нужные операции делаем. например вывод на страницу
    console.log(tag)
    return tag;
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы