How would I get about creating this element? [closed]

I have an element with content either side (can’t share because of privacy) and down the middle is a dotted squiggly line. As you scroll up and down the dotted line is covered/uncovered by a solid squiggly line in the same shape (to represent a scroll)

How would I even go about this? I have currently set them both as background images. Am I able to almost crop the solid blue squiggle depending on when I am in terms of scrolling. Is that something this is possible? That’s my main thought.

Any other better ideas are welcome.

Picture of squiggles talked about in post