Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как добавить функцию автоматического закрытия модального окна по таймеру? (https://javascript.ru/forum/misc/79437-kak-dobavit-funkciyu-avtomaticheskogo-zakrytiya-modalnogo-okna-po-tajjmeru.html)

lamo 09.02.2020 13:24

Как добавить функцию автоматического закрытия модального окна по таймеру?
 
Создал модальное окно, которое будет открываться автоматически при открытии странички, но не могу привязать однократное автоматическое закрытие этого окна по таймеру.
Было б классно, если это можно как-то отдельно прописать, чтоб кукисы использовались. При каждом обновлении это модальное окно раздражает.

https://jsfiddle.net/mne91L2u/ (для удобства туть она)
или туть:

<div class="info">
      <div class="buttons">
        <p>
          <a href="#modal" data-modal="#modal" class="modal__trigger">Преимущества</a>

        </p>
      </div>
    </div>


  <!-- Modal -->
  <div id="modal" class="modal modal__bg" role="dialog" aria-hidden="true">
    <div class="modal__dialog">
      <div class="modal__content">
        <h1>Преимущества</h1>
        <p>- Полный фотоотчет процесса ремонта и строительства</p>
        <p>- Используем в работе свой транспорт, склады и специализированный инструмент</p>
        <p>- На Вашем объекте инженеры с высшим образованием</p>
        <p>- Гарантия чистоты после монтажных и демонтажных работ</p>
        
        <!-- modal close button -->
        <a href="" class="modal__close demo-close">
       
        
          <svg class="" viewBox="0 0 24 24"><path d="M19 6.41l-1.41-1.41-5.59 5.59-5.59-5.59-1.41 1.41 5.59 5.59-5.59 5.59 1.41 1.41 5.59-5.59 5.59 5.59 1.41-1.41-5.59-5.59z"/><path d="M0 0h24v24h-24z" fill="none"/></svg>
        </a>
        
      </div>
    </div>
  </div>


// Получим наш параграф
  var el = document.querySelector('.modal__trigger');

// Тут запускаем через 5 секунд симуляцию клика по парагафу
  setTimeout(function(){
    el.click();
  }, 1000);

рони 09.02.2020 14:14

lamo,
// Получим наш параграф
  var el = document.querySelector('.modal__trigger');
  var id = el.getAttribute('href');
  var close = document.querySelector(id + ' .modal__close');
  var open = sessionStorage.getItem('open');

// Тут запускаем через 5 секунд симуляцию клика по парагафу
  if(!open){setTimeout(function(){
    el.click();
  setTimeout(function(){
    close.click();

  }, 5000);
  }, 1000);
  sessionStorage.setItem('open', 'ok');}

lamo 09.02.2020 16:44

Вы мой спаситель, спасибо большое!


Часовой пояс GMT +3, время: 09:25.