When I go to my website I want it to first load the background image fully and not show yet, ones done fully loading I just want it to fade in slowly.

I tried something like this:

2.     $(".background").load(function(e){
3.         $(".background").fadeIn(1000);
4.     });

And I tried something like this:

1. $('.achtergrond', this).fadeIn("slow");

Both in document ready function.

The HTML I'm using is:

1. <div align="center"><img class="background" src="images/background.jpg"></div>

2. .background {
3.     width: 100%;
4.     height: 100%;
5.     position: fixed;
6.     top: 0;
7.     left: 0;
8.     z-index: -5000;
9.     display:none;
10. }

Hopefully someone is able to help me out