Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.11.2019, 18:23
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

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

Есть ссылка (Нажать) при клике происходит задержка в 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
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

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

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

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
Ответить с цитированием
  #3 (permalink)  
Старый 21.11.2019, 18:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

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>
Ответить с цитированием
  #4 (permalink)  
Старый 21.11.2019, 19:47
Интересующийся
Отправить личное сообщение для kseosru Посмотреть профиль Найти все сообщения от kseosru
 
Регистрация: 29.03.2018
Сообщений: 13

Спасбо Вам!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
стрелки вниз, верх при раздвижение блоков dima018 Элементы интерфейса 8 12.02.2018 21:29
Закрытие блока через заданное время! Andrey_55 Общие вопросы Javascript 1 02.03.2016 10:04
После скрытия блока через заданное время zoOmer Общие вопросы Javascript 8 13.01.2014 18:51
Position fixed, но динамический по оси ОХ tvixa Элементы интерфейса 4 09.09.2013 15:39
Время жизни блока (сообщения) ILYA609 jQuery 1 18.03.2010 00:42