是否有可靠的方法来检测元素何时变得不可见从用户的Angular 来看?因此,它不仅应该检查 display:none 或 visibility:hidden 之类的内容,还应该检测另一个具有更高z索引的元素何时被放置在元素之上。
(我不这么认为,但我还是要问,以防我错了。
编辑:好了,问题已经结束了,“更新问题,使它只关注一个问题”。我不知道如何更好地表达自己,检测一个元素何时从用户的Angular 变得不可见对我来说似乎是一个单一的问题。这里是我上面给出的例子的一些代码,希望能使问题更清晰:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn0").click(function(){
$("#div0").css({"visibility":"visible"});
});
});
</script>
</head>
<body>
<button id = "btn0">Click to hide this button with something</button>
<div id="div0" style="width:100%;height:100%;position:absolute;top:0;left:0;z-index:10;background-color:green;visibility:hidden">Now you can't see the button</div>
</body>
</html>
字符串
所以,用户点击按钮,div弹出。按钮仍然在div元素后面。它的“visibility”或“display”值没有改变。但对用户来说,它是不可见的。所以我想要的是我可以订阅的按钮的某种可靠的“elementUserVisibilityChanged”事件。
1条答案
按热度按时间s71maibg1#
Intersection ObserverAPI就是要做到这一点.
https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
它可以变得相当复杂,这取决于您的需要,所以快乐阅读!