Hintergrundbild wird in Chrome/Safari abgeschnitten

Question

Ich habe ein div mit einem Hintergrundbild zum Verdecken. Ich setze die Größe des Bildcontainers 100px größer als das Fenster auf allen Seiten. Dann bin ich Tweenlite, um den Hintergrund basierend auf der Mausposition zu verschieben.

Funktioniert gut in FF. Nicht so sehr in Chrome/Safari. Das Hintergrundbild scheint abgeschnitten zu sein.

Hier ist ein Link, der meine Frage stellt: http://codepen.io/iknowbryan/pen/xENgrX

.bg{ 
    background: url(https://unsplash.it/1800/1100/?random) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 

    position: absolute; 
    top: -100px; 
    left: -100px; 
    bottom: -100px; 
    right: -100px; 
} 

Irgendwelche Ideen ?!

Answer 1

Sie setzen fest auf den Hintergrund entfernen Sie es.

background: url(https://unsplash.it/1800/1100/?random) no-repeat center; 

Answer 2

Breakout den Hintergrund. Manchmal kann Hintergrunddefinition "sensativ" sein.

.bg{ 
    background-image: url(https://unsplash.it/1800/1100/?random); 
    background-position: center; 
    background-repeat: no-repeat; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    background-attachment: fixed; 
    position: absolute; 
    top: -100px; 
    left: -100px; 
    bottom: -100px; 
    right: -100px; 
}