Javascript 根据屏幕大小加载元素以填充屏幕

我正在寻找一种根据视口大小使用元素填充视口的方法

有没有一种方法可以使用像

createElement（）

和

load（）

这样的方法来实现这一点

具体来说，我尝试用小圆圈div填充视口。我现在设置它的方法是，只需手动将它们全部编码到html中，并将overflow设置为hidden，这样屏幕大小以外的div就不可见了

如果这是不可能的，有没有一种方法可以告诉JS我正在运行的动画只是那些可见的div

---

我这里有一个有div的密码笔，作为我所说的参考。全屏显示时，您可以看到页面底部缺少div。

看到了吗，笔在哪里？我发誓，它就在那里！你的绿色是黄色的。。。