KP-C

Kevin Powell - Community•2y ago•

5 replies

SkyZeLight

Searching for a specific background clip/mask property

Hi, I've been searching for a specific property that would allow me to reveal a background behind some elements. Here's the tricky part, I have several divs that are following the user's mouse and are created/deleted dynamically (for an animation) I would like to be able to reveal a background hidden behind those divs (similar to a flashlight I suppose). I searched a bunch and stumbled upon masks which would be great except I have a pattern for a full screen background and as far as I understand masks need to be put on the parent (in this case the small divs which would ruin the background or force me to repeat the background inside those divs instead. If any of you know of a property that would help me with that it would be greatly appreciated. Many thanks!

TLDR. I would like to reveal a background behind the "circles". Video of what the effect looks like for reference: https://www.youtube.com/shorts/VTw2cUVFl1c

YouTubeHyperplexed

Interactive Liquid Effect - Vanilla JS

Watch as I show you how to create a sweet interactive liquid effect using just divs!

Support the channel: https://ko-fi.com/hyperplexed (accepts PayPal, card, etc).

CodePen: https://cdpn.io/abYjPXx

Tools used: HTML, CSS, JavaScript

Music Credits:

When I Was Younger - StreamBeats - Lofi - Harris Heller
Moderna Warfare - StreamBeats - EDM - H...