Открытие div по нажатию с задержкой

325

06 сентября 2017, 12:21

Добрый день, нужно есть скрипт открывающий скрытый див по нажатию на ссылку. Нужно сделать открытие с задержкой в 3сек, как это сделать? settimeout перед функцией не работает.

<!DOCTYPE html>
<meta charset="utf-8">
<head>
<title>Задание 2</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<a href="#" onclick="show('div')">ссылка</a>
<div id="div">
Произвольный текст.
</div>
<script src="main2.js"></script>
</body>

function show(id) {
   document.getElementById(id).style.display = 'block';
}

Answer 1

function show(id) { 
  setTimeout(function(){ 
    document.getElementById(id).style.display = 'block'; 
  },3000) 
}

Answer 2

Еще как вариант

var link = document.querySelector('.link'), 
    alert = document.querySelector('.alert'); 
 
link.onclick = function(e) { 
    e.preventDefault(); 
    alert.classList.add('alert-show'); 
}

.alert { 
    opacity: 0; 
    visibility: hidden;     
    padding: 8px 15px; 
    background: tomato; 
    color: #fff; 
    display: inline-block; 
    border-radius: 3px; 
    transition: 0s; 
} 
.alert-show { 
    opacity: 1; 
    visibility: visible; 
    transition-delay: 3s; 
}

<a href="#" class="link">ссылка</a> 
<div class="alert"> 
    Произвольный текст. 
</div>

Answer 3

function show(id) { 
   setTimeout(function() { 
      document.getElementById(id).style.display = 'block'; 
   }, 3000); 
}

<a href="#" onclick="show('div')">ссылка</a> 
<div id="div" style="display:none"> 
Произвольный текст. 
</div>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Странная ситуация с ссылкой this

Привет всем, скажите пожалуйста почему в событии MouseMove объекта не работает такая конструкция

507

Почему долго открывается форма?

При нажатии на меню проходит порядка 5-8 сек, хотя с остальными формами все нормПочему долго открывается форма ?

274

Уничтожение объекта, как условие Unity, C# [требует правки]

"Если объект уничтожен, то выполняется условие" - вот этот когда надо сделать, но понять, как реализовать, я не могу

275

C#. Экранирование спецсимволов в строке для SQL запроса

306