Während dem Laden des background-Bildes Farbverlauf anzeigen

[Tobi44]

Hallo,

ich zeige auf einer Seite ein Hintergrundbild an. Während dem Laden soll ein Farbverlauf anstelle einer weißen Seite angezeigt werden.
Möglich müsste das sein, denn ich kann ja auch bspw. vor das background:url ein #eee setzen um eine Hintergrundfarbe anzuzeigen, die dann auch angezeigt wird, bis das Bild geladen wurde.

Habe es nun so gestaltet:

background: -ms-linear-gradient(top, #157EBC 0%, #EEEEEE 100%);
background: -moz-linear-gradient(top, #157EBC 0%, #EEEEEE 100%);
background: -o-linear-gradient(top, #157EBC 0%, #EEEEEE 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #157EBC), color-stop(1, #EEEEEE));
background: -webkit-linear-gradient(top, #157EBC 0%, #EEEEEE 100%);
background: linear-gradient(to bottom, #157EBC 0%, #EEEEEE 100%);

background:url('P1000000.JPG') no-repeat left center;
background-size: cover;
background-attachment: fixed;

Leider wird mir während des Ladens kein Farbverlauf angezeigt. Was mache ich falsch?

Edit:
Im Firefox funktioniert dies, wenn ich folgendes mache:

background: url('P1000000.JPG') no-repeat left center, linear-gradient(to bottom, #157ebc 0%, #eee 100%);

Dies führt aber dazu, dass im Safari das Hintergrundbild gar nicht mehr angezeigt wird.

Danke und ein gutes Neues Jahr.

 

[Tronjer]

Dies führt aber dazu, dass im Safari das Hintergrundbild gar nicht mehr angezeigt wird.

Schreibe mal background-image.

Nebenbei bemerkt: Wenn du beim Laden des Hintergrundbildes eine weiße Seite siehst, dann ist das Bild zu groß.