Detect when a div is outside of the screen

I have a page where I can order a product. So there is a "buy" button.

I would like, when the user scrolls down, when the button disappear to create a fixed bar at botttom of screen with this same button "Buy".

I was wondering if I have to do it like this :

screenHeight = window.innerHeight;

if (screenHeight > 400) { // do this }
else { // do this }

Or maybe there is a proper way to do this. Detecting when this button goes out of displayed screen ?

I am working with React.

Thank you

>Solution :

you can use this package react-intersection-observer