I would like to make the image a little transparent for a short time by pressing the button and then make it visible again normally. Why does the code not work?
<!DOCTYPE html>
<html>
<head>
<style>
img {
width: 128px;
height: 128px;
padding: 10px;
}
img:hover {
opacity: 0.5;
}
</style>
</head>
<body>
<div id="epicenter">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Face-devil-grin.svg/1024px-Face-devil-grin.svg.png" alt="Schwarz" id="black">
</div>
<button onclick="test()">Test</button>
<script>
function sleep(miliseconds) {
var currentTime = new Date().getTime();
while (currentTime + miliseconds >= new Date().getTime()) {
}
}
function test() {
document.getElementById("black").style.opacity = "0.33";
sleep(3000);
document.getElementById("black").style.opacity = "1";
}
</script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire