Ошибка в повторении кода?

195
02 августа 2017, 23:08

Добрый день! Есть скрипт модального окна, которое открывается по клику. Этот код править я не могу, а именно указать в нем функцию delay.

jQuery(document).ready(function () {
jQuery('.open_login').click(function(e) {
    e.preventDefault();
    jQuery('body').css({overflow: 'hidden',});
    jQuery('.login_lightbox').fadeIn(800);
    jQuery('.login_overlay').fadeIn(800);
});
jQuery('.login_close').click(function(e) {
    e.preventDefault();
    jQuery('.login_overlay').fadeOut(0);
    jQuery('.login_lightbox').fadeOut(0);
    jQuery('body').css({overflow: 'auto',});
});
});

Ниже в коде страницы этот скрипт дублируется.

jQuery(document).ready(function () {
    var delay = 30;
$('.login_overlay').delay(delay * 1000).fadeIn(800,function(){
    jQuery('body').css({overflow: 'hidden',});
    jQuery('.login_lightbox').fadeIn(800);
    jQuery('.login_overlay').fadeIn(800);
});
jQuery('.login_close').click(function(e) {
    e.preventDefault();
    jQuery('.login_overlay').fadeOut(0);
    jQuery('.login_lightbox').fadeOut(0);
    jQuery('body').css({overflow: 'auto',});
});
});

Это сделано для того, чтобы окно автоматически открывалось через определенное время. Но при этом, конечно, есть одна проблема: невозможно открыть окно по клику до того, как оно откроется автоматически. После того, как оно само откроется, по клику его уже можно открывать. Как исправить эту ошибку? Благодарю за помощь! https://jsfiddle.net/LADYX/428ay5np/1/

Answer 1

Всё-таки предложу в качестве решения setTimeout

// Наш код 
jQuery(document).ready(function() { 
  var delay = 5; 
 
  // устанавливаем таймаут 
  var timeoutId = setTimeout(function() { 
    // по истечении времени, сгенерируем событие `click` на `.open_login` 
    $('.open_login').trigger('click'); 
  }, delay * 1000); 
 
  // если после открытия диалога в ручную, его не надо отображать по таймеру, 
  // назначим обработчик для отмены таймаута 
  $('.open_login').one('click', function() { 
    clearTimeout(timeoutId) 
  }) 
}); 
 
// Код, который нельзя править 
jQuery(document).ready(function() { 
  jQuery('.open_login').click(function(e) { 
    e.preventDefault(); 
    jQuery('body').css({ 
      overflow: 'hidden', 
    }); 
    jQuery('.login_lightbox').fadeIn(800); 
    jQuery('.login_overlay').fadeIn(800); 
  }); 
  jQuery('.login_close').click(function(e) { 
    e.preventDefault(); 
    jQuery('.login_overlay').fadeOut(0); 
    jQuery('.login_lightbox').fadeOut(0); 
    jQuery('body').css({ 
      overflow: 'auto', 
    }); 
  }); 
});
.login_overlay { 
  display: none; 
} 
 
.login_lightbox { 
  background: #fff; 
  border: 1px solid #000; 
  display: none; 
  height: 150px; 
  width: 300px; 
} 
 
.login_close { 
  cursor: pointer; 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class="open_login">Open</button> 
 
<div class="login_overlay"> 
  <div class="login_lightbox"> 
    <div class="login_close">&times;</div> 
  </div> 
</div>

READ ALSO
Вставка значения из атрибута в input

Вставка значения из атрибута в input

Есть атрибут data-lesson и есть пару занятий с этим же атрибутом, но ( как очевидно ) с разными значениямиПри нажатии на кнопку должно браться значение...

241
Не отображается SVG в &lt;div title&gt; (Gmail проблема)

Не отображается SVG в <div title> (Gmail проблема)

Сделал шаблон для рассылки писем с дизайном и прочимСтолкнулся с одной проблемой: не отображаются никакие изображения в начале письма

191
Обработка AJAX - запроса

Обработка AJAX - запроса

Получаю страницу ajax - запросом

173
Помогите написать скрипт для игры на unity [требует правки]

Помогите написать скрипт для игры на unity [требует правки]

И так есть 2 сцены в первой кликер,на который нужно нажать 10 раз и после вылазиет приз, картинка доллара(например)И нужно что бы во второй сцене...

206