Форум

kseosru · #1 (**permalink**) 21.11.2019, 18:23

Мир вашему дому! Помогите с решением одной небольшой задачи, я новичок. Очень нужна ваша помощь.

Есть ссылка (Нажать) при клике происходит задержка в 5 секунд и после перенаправляет на сайт.

Вопрос.
Как во время задержки, сразу после нажатия на ссылку, вывести плавно блок <span>текст</span> ?

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {

$('.js-anchor').on('click', function(e) {
e.preventDefault();

var
href = $(this).attr('href'),
timeout = 5000;

setTimeout(function() {
//window.open(href, '_self');
location.href = href;
}, timeout);

});

});
</script>

<span>текст</span>
<a class="js-anchor" href="http://yandex.ru">Нажать</a>

рони · #2 (**permalink**) 21.11.2019, 18:36

kseosru,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони · #3 (**permalink**) 21.11.2019, 18:38

kseosru,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  span{
      display: none;
  }

  </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

  <script>
jQuery(function($) {
$(".js-anchor").on("click", function(e) {
e.preventDefault();
$(this).delay(5000).queue(function() {
location.href = this.getAttribute("href");
})
$("span").show(1000)
})
});
  </script>
</head>

<body>
<span>текст</span>
<a class="js-anchor" href="http://yandex.ru">Нажать</a>
</body>
</html>

kseosru · #4 (**permalink**) 21.11.2019, 19:47

Спасбо Вам!

Форум

Справочник

Discord чат

Курсы javascript