I have a text element (Toon Cookiekeuzes) that I would like to display at the bottom-right of the viewport only when the user has scrolled to the bottom of the page. This will result in the element appearing in the footer. Presently, it is always visible. How would I approach this?
Another approach could be to use positioning so that the element always sits on top of the Footer at the bottom of the page. I don’t know which way is better.
Follow the same pattern that you have done for the scroll-to-top-arrow. You are monitoring it with js and then adding a class once the screen has scrolled x amount. You need to do similar for the element in the footer except that you only add a class once the page has scrolled to the bottom.
Find the script for the back to top arrow and then see if you can create a new one for your footer element.
That would just be normal css and html so I don’t need to help you with that. As to which is better is subjective . Simpler is usually better in my opinion.