0

Есть модальное окно:

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Сейчас мы закрыты<br>
        Режим работы с 10:00 до 22:00
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Подскажите как сделать что бы посетителю это окно открывалось один раз при каждом новом заходе на сайт с 22:00 до 10:00?

1 ответ 1

0

При посещении пользователем страницы получаете его время:

let now = new Date();

Переводите время в секунды:

const hourse = now.getHours()
const minutes = now.getMinutes()
const seconds = now.getSeconds()

now = hourse * 3600 + minutes * 60 + seconds

Проверяете, в какой диапазон входит текущее время:

  const minHours = 10 * 3600
  const maxHourse = 22 * 3600
    if (now > minHours && now < maxHourse) {
        now = maxHourse - now
    } else {
      now = 0
    }

Затем создаете функцию, которая по истечении времени (расчетов выше), запускает ваш код появления модального окна.

function showModal(time) {
       setTimeout(() => {
          //Ваш код
       }, time)
    };

Ну и вызываете функцию:

showModal(now * 1000);
4
  • Не могли бы подсказать как это вставить в HTML?
    – artem19
    16 мая 2022 в 14:52
  • А вы подключали js к странице и работали с ним?
    – Evgenii
    16 мая 2022 в 14:54
  • Да, я в index.html добавил это <script type="text/javascript" > let now = new Date().getHours() if (now > 10 && now < 22) { now = 22 - now } else { now = 0 } function showModal(time) { setTimeout(() => { //Ваш код }, time) }; showModal(now); </script> Только в место ваш код, код модального окна
    – artem19
    16 мая 2022 в 15:17
  • Перевел часы в миллисекунды, должно работать
    – Evgenii
    16 мая 2022 в 15:47

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.