-1

I have an SVG which is sticky, within a column that streches from top to bottom of the website.

How do I change the fill colour of the SVG when at exactly 50% of the way down the page on scroll?

I can see how it can be done with javascript when scrolling a defined number of pixels down the page, but I need percentage of page.

I would show my workings so far, but so far I have completely drawn a blank.

Any help would be appreciated.

WebFlair
  • 1

1 Answers1

0

You can use the document.body.clientHeight property to get the full height of your webpage in pixels then multiply it by 0.5 to get the 50% of it's total height

Anurag Samota
  • 1
  • 1