Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.02.2020, 12:24
Новичок на форуме
Отправить личное сообщение для lamo Посмотреть профиль Найти все сообщения от lamo
 
Регистрация: 09.02.2020
Сообщений: 2

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

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);
Ответить с цитированием
  #2 (permalink)  
Старый 09.02.2020, 13:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 28,907

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');}
Ответить с цитированием
  #3 (permalink)  
Старый 09.02.2020, 15:44
Новичок на форуме
Отправить личное сообщение для lamo Посмотреть профиль Найти все сообщения от lamo
 
Регистрация: 09.02.2020
Сообщений: 2

Вы мой спаситель, спасибо большое!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как добавить значение в функцию конструктор, а не просто перезаписать. SomebodySomeone Общие вопросы Javascript 1 24.06.2018 23:56
Как добавить в таймер функцию сброса? Morty Events/DOM/Window 0 01.03.2018 15:22
Добавить к body класс при открытии модального окна maxg5 jQuery 8 20.02.2018 18:55
Как по событию click function запустить lightbox функцию? cheizer jQuery 0 04.01.2018 23:09
Как добавить элемент в XML через DOM используя PHP? bayah Серверные языки и технологии 6 11.08.2010 12:33