Dokumentaufbau

Der Quelltext wurde erfolgreich in die Zwischenablage kopiert.

Code Elemente - HTML - CSS - JS

            
<!doctype html>
<html lang="de">
<head>
  <meta charset=utf-8>
  <title>HTML5 CSS3 JS</title>

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

  <!-- CSS *************************** -->
  <style>

  </style>
  </head>

<!-- HTML *************************** -->
<body>

  <!-- Javascript ************************ -->
  <script type="text/javascript" src="https://depot43.ch/unterlagen/themes/bootstrap/js/skrollr.min.js"></script>
  <!-- jQuery optional -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
  <script type="text/javascript">
  
    	var s = skrollr.init();
  
  </script>
</body>
</html>

Grundlage

Um die Prinzhorn skrollr-Bibliothek nutzen zu können muss:

der Link auf die Javascriptbibliothek erstellt werden: (Zeile 23)

  <script type="text/javascript" src="http://depot43.ch/unterlagen/themes/bootstrap/js/skrollr.min.js"></script>

Die Benutzung von jQuery ist nicht nötig, empfiehlt sich aber für eine praktische Arbeitsumgebung beim Bau eines Parallax-Projekts.
```
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
```

der Aufruf eingefügt werden: (Zeile 26)

<script type="text/javascript">

 var s = skrollr.init();

 </script>

Die zusätzliche Benutzung von Bootstrap-CSS dient einzig der Gestaltung. Für eine Animation mit Prinzhorn Skrollr ist dies nicht notwendig.