1

есть модальное окно, которое открывается с кнопки. Подскажите, пожалуйста, скрипт (java), который будет открывать окно сразу при загрузке страницы? заранее благодарю

<a href="#openModal-1" class="glo">ЗАБРАТЬ</a>
<div id="openModal-1" class="modal-1">
  <div class="modal-dialog-1">
    <div class="modal-content-1">
      <div class="modal-header-1">
        <h3 class="modal-title-1">ПОЗДРАВЛЯЕМ!</h3></br>
      </div>
      <p>ВЫ ВЫИГРАЛИ: </p>
      <div class="modal-body-1" id="okno"></div>  
      <a class="glo">ЗАБРАТЬ</a></br>
    </div>
  </div>
</div>

1
  • нужен именно код скрипта javascript, который будет автоматически вызывать это окно при загрузке страницы Commented 12 мар. 2021 в 15:22

2 ответа 2

0

function showPopup() {
  document.getElementById('openModal-1').style.display = 'block';
}
window.onload = showPopup();
#openModal-1 {
  display: none;
}
<a href="#openModal-1" class="glo">ЗАБРАТЬ</a>
<div id="openModal-1" class="modal-1">
  <div class="modal-dialog-1">
    <div class="modal-content-1">
      <div class="modal-header-1">
        <h3 class="modal-title-1">ПОЗДРАВЛЯЕМ!</h3>
        </br>
      </div>
      <p>ВЫ ВЫИГРАЛИ: </p>
      <div class="modal-body-1" id="okno"></div>
      <a class="glo">ЗАБРАТЬ</a></br>
    </div>
  </div>
</div>

Можно добавить легкую анимацию. Например:

function showPopup() {
  document.getElementById('openModal-1').style.display = 'block';
}
window.onload = showPopup();
#openModal-1 {
  display: none;
  background: pink; opacity: 0;
  animation: animate 2s linear forwards;
}

@keyframes animate {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
<a href="#openModal-1" class="glo">ЗАБРАТЬ</a>
<div id="openModal-1" class="modal-1">
  <div class="modal-dialog-1">
    <div class="modal-content-1">
      <div class="modal-header-1">
        <h3 class="modal-title-1">ПОЗДРАВЛЯЕМ!</h3>
        </br>
      </div>
      <p>ВЫ ВЫИГРАЛИ: </p>
      <div class="modal-body-1" id="okno"></div>
      <a class="glo">ЗАБРАТЬ</a></br>
    </div>
  </div>
</div>

4
  • то есть, мне нужно добавить этот код function showPopup() { document.getElementById('openModal-1').style.display = 'block'; } window.onload = showPopup(); между тегами <script></script>? Commented 12 мар. 2021 в 18:20
  • извиняюсь, все равно не работает. при загрузке страницы все равно окно не появляется Commented 13 мар. 2021 в 13:24
  • да, безусловно, у вас все работает. я копирую ваш код, вставляю себе и он не работает...это значит, что я делаю что-то не так Commented 13 мар. 2021 в 13:58
  • спасибо, успехов! Commented 13 мар. 2021 в 14:11
0

Просто вставьте этот код в скрипте перед </body>

$("#openModal-1").modal()
0

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

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