Wie behalte ich mein Hintergrundbild über den Bildschirm beim Scrollen/Ändern

Question

Was ich versuche zu tun ist Parallax Scrollen durch mehrere Bilder, aber irgendwie 1) Tiling passiert (Bild wiederholt sich oder es zeigt nicht die volle Bild) und 2) Wenn ich verschiedene Bildschirmgrößen (vor allem Mobiltelefone) versuche, funktioniert es nicht, da das Bild nicht die Größe ändert.

Gibt es eine Möglichkeit, das zu beheben?

section.module.parallax-1 { 
    background-image: url("http://cdn.udderlypettable.com/wp-content/uploads/2015/05/Maine-Coon-Face.jpg"); 
    background-repeat: no-repeat; 
    background-size: cover; 
} 

Ich habe meinen Code setzen auf Codepen

Answer 1

Verwendung background-size: cover. Auf diese Weise würde Ihr Hintergrundbild entsprechend der Größe div der Größe angepasst werden.