Relative Content

Tag Archive for javascripthtmlcssfadeinintersection-observer

HTML, JavaScript, CSS, fade-in troubleshooting

I am trying to add a fade in and slide up feature to some of the content in the middle of my HTML page as I scroll down. Currently I am having issues with the fade in. I am trying to apply the fade-in to a paragraph and button tag and both of them have two classes. Their own class for styling and then a .fade-in class which applies the styles for the fade in. I am implementing the fade-in through JavaScript. At the moment though, after I applied the .fade-in styles, the content isn’t showing up on the page anymore because I set the fade-in to opacity 0. While I scroll down, the content should fade in due to the fade-in.appear class which has opacity 1 but still the content is not visible.