[How to change div background image when element reaches a certain scroll height]

Thank you!

[How to change div background image when element reaches a certain scroll height]

Hi I am trying to trigger a background image change in the left column when the headings in the right column reach about 400px from the bottom of the screen. The code I have right now changes the images but not at the correct scroll height. Any help would be greatly appreciated. Thanks.

See the Pen abRGdLr by dcarrano72 (@dcarrano72) on CodePen