I think that only my html and my javascript should be necessary for this example. Basically, I am trying to make the elements have something happen to them in CSS in JS with a delay. However, I am unable to seem to get the setTimeout feature to get it to work. I am well aware of the Jquery delay function, but, I want to be able to do it in JavaScript. This is my HTML and this is my JS.
let div1 = document.querySelectorAll('div');
for (i = 0; i < div1.length; i++) {
div1[i].addEventListener('click',
function() {
setTimeout(function() {
this.style.display = "none";
}, 200)
},
false);
}<!Doctype html>
<html>
<head>
<link rel="stylesheet" href="../CSS/csstest.css">
</head>
<body>
<section class="grid">
<div class="img1">aaaa</div>
<div class="img2">bbbb</div>
<div class="img3">cccc</div>
<div class="img4">dddd</div>
<div class="img5">eeee</div>
<div class="img6">ffff</div>
<div class="img7">gggg</div>
<div class="img8">hhhh</div>
</section>
<script src="../JS/testjs.js"></script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire