如何将类添加到视口中不完全可见的元素？

Question

我有一个类似于旋转木马的东西，其中包含溢出的容器内的元素：隐藏

我可以向左和向右滚动，我想确定哪些元素根本不可见，或者只有一半是可见的（就像在这张图片上一样），并且当添加到这个看不见的半可见元素时。

每个元素的宽度例如是100px，但容器的宽度取决于屏幕大小。我可以获得可见的元素数量（通过将容器的offsetWidth除以一个元素的宽度）

另外我知道有getBoundingClientRect()这样的东西，但在这种情况下不确定如何使用它。

example

在这里，您可以看到我如何尝试实施getBoundingClientRect，但我无法确定要定位的元素。我想将div添加到部分看到的div（第4个），如果在第一个div的第一个点击部分也会看到 - 也是。