2016-08-02 8 views
-2

Ich bin nicht wirklich sicher, wie man die Funktion erklärt, und deshalb war ich auch nicht in der Lage, die Antwort zu suchen (ich habe versucht), aber wie die Titel sagt, wollte ich das ausprobieren Effekt, wenn es sich für ex anfühlt. Der Kopfhintergrund bewegt sich nicht beim Scrollen, sondern die Container, die sich nach oben bewegen? Ein gutes Beispiel ist diese Bootstrap-Vorlage http://wrapbootstrap.com/preview/WB0915821 der Header und auch später der Typ mit der Brille, ich möchte diesen Effekt mit meiner eigenen Website ausprobieren. Könnte mir bitte jemand helfen und mir sagen, dass du diesen Effekt/dieses Kommando nennen würdest?Hintergrund folgt nicht? vielleicht rutscht hinter den divs? nicht sicher, wie man es setzt

+0

Parallax scrollen? –

+0

Danke Dani Ich werde es nachschlagen = D – stoffer03

Antwort

1

Wenn ich Sie richtig verstehe, denken Sie an Parallax Scrolling. W3schools hat , um es zu implementieren. Es geht meistens nur darum, ein festes Hintergrundelement zu setzen. Hier ist eines der von ihnen bereitgestellten Beispiele.

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body, html { 
    height: 100%; 
} 

.parallax { 
    /* The image used */ 
    background-image: url('img_parallax.jpg'); 

    /* Full height */ 
    height: 100%; 

    /* Create the parallax scrolling effect */ 
    background-attachment: fixed; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: cover; 
} 
</style> 
</head> 
<body> 

<div class="parallax"></div> 

<div style="height:1000px;background-color:red;font-size:36px"> 
Scroll Up and Down this page to see the parallax scrolling effect. 
This div is just here to enable scrolling. 
Tip: Try to remove the background-attachment property to remove the scrolling effect. 
</div> 

<div class="parallax"></div> 

</body> 
</html> 
+0

Wow, danke Benjamin, ich werde es heute Abend versuchen, wenn ich nach Hause komme. Schätzen Sie es sehr – stoffer03

+0

es funktionierte schön! Ich hatte ein paar Probleme damit, es in meinen bereits geschriebenen Code zu mixen, aber ich kam um mich herum. Jetzt ist eine Sache weniger auf meiner Liste wirklich dankbar – stoffer03