当类名称为“ earth”的div左侧为100％时，如何获得警报？请不要使用jQuery，谢谢！我尝试使用setTimeout，但我希望有另一种方法，而不必依赖时间，而是取决于位置
<!DOCTYPE html>
<html>
<head>
<style>
.earth {
position :relative;
animation:move 10s linear;
background:red;
height:20px;
width:20px;
}
@-webkit-keyframes move
{
from { left: 0%; }
to { left: 100%; }
}
</style>
<script>
function changetext () {
document.getElementById("demo").style.color = "red";
animation();
}
function animation() {
document.getElementById('ghost').className ='earth';
}
function repeat() {
var sd = document.getElementById("ghost").className = 'earth';
sd.style.display = 'none';
}
</script>
</head>
<body>
<div class="something"></div>
<div id="ghost"> </div>
<p onclick="changetext();" id="demo"> HELLO WORLD </p>
</body>
</html>
最佳答案
您可以使用animationend事件：
var anim = document.querySelector(".earth");
anim.addEventListener("animationend", function() {
console.log('end !');
});.earth {
position: relative;
animation: move 10s linear;
background: red;
height: 20px;
width: 20px;
}
@-webkit-keyframes move {
from {
left: 0%;
}
to {
left: 100%;
}
}<div class="earth"></div>关于javascript - Javascript-当div左侧为100％时，如何获得警报？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49214077/