fade in elements

i received a request for how i fade in elements on my landing page and home page.

i use a combination of a css animation and html tags to make this possible. firstly, put this code somewhere in your file - i typically put it somewhere in the < head > section.



follow that up by putting these tags around any element you want to fade in when your page is loaded:



you can play around with it and have different fade-in times for different elements, apply it to some of your page, or the whole page if you'd like. on my index page, i use a 2-second time for the main image and an 7-second time for the side link elements. to do this, you have to copy the code a second time and rename everything accordingly - it's a bit complex to keep track of but with enough working you should be able to time your elements the way you want!