Can I make it so that the background image of my website doesn't appear until fully loaded?

I have a simple tiled pattern for the background of my website using a 150×150 image.

When I load the page in Safari, you see the background image as it loads, “streaking” down the page. While it doesn’t last long because it’s a small image, it looks incredibly tacky.

Is there any way to stop this from happening in my code?

I’m creating the background by putting this in my stylesheet:

body, html
{
background-image: url(../images/background.jpg);
}