Тема: click jquery
Показать сообщение отдельно
  #11 (permalink)  
Старый 12.11.2018, 22:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,120

magnificPopup timer
SolomonRei,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .mfp-hide{
  display: none;
  }
 .white-popup {
  position: relative;
  background-color: #FFFFFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
  <script>
jQuery(document).ready(function($) {
    var tm;
    $('.popup-with-form-allabout').click(function(event){
        event.preventDefault();
        window.clearTimeout(tm);
        tm = window.setTimeout(function() {
        $.magnificPopup.open({
        items : {src : '#form-popup', type: 'inline'}

      });
}, 5000)

    });
});

  </script>
</head>

<body>


<a href="#form-popup" class = "popup-with-form-allabout" style = "text-decoration: none;"><div class = "mainButton">Написать нам</div></a>





<div id="form-popup" class="white-popup mfp-hide" >

 test


    </div>


</body>
</html>
Ответить с цитированием