Hoe maak ik een preloader met een image fade in/out?

Hallo,

Ik wil graag een preloader op mijn Joomla website hebben.
Hierbij wil ik het volgende bereiken:
1) Het moet een eigen image kunnen gebruiken i.p.v. voorgebakken cirkeltjes m.b.v. css
2) Het image moet een fade in en fade out hebben totdat de gehele website is geladen.

Hoe los ik dit op?
De enige info die ik op het internet kan vinden is hoe je animaties kunt maken die ronddraaien maar daar ben ik niet naar op zoek.
Wie kan mij helpen?

Misschien staat hier iets tussen wat je kan gebruiken
preloader zoeken

Nee, dat heb ik allemaal bekeken maar daar zit niets tussen wat mijn probleem oplost.
Hoofdzakelijk standaard werk met css animaties en daar ben ik juist niet naar op zoek.

Toch bedankt voor het reageren!