-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
59 lines (57 loc) · 2.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Scroll Magic Study</title>
<meta name="Scroll Magic Study" content="A study in Scroll Magic animations" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="index.css" />
<!-- <script src="index.js" defer></script> -->
</head>
<body>
<header class="">
<h1>Scroll Magic Study</h1>
</header>
<section class="product">
<div class="product-title">
<h2>Products</h2>
</div>
<div class="product-pages">
<div>
<h2>Product One</h2>
<p class="text">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium magnam dolorum quaerat. Architecto
amet ipsam totam reiciendis ipsum voluptatem enim nemo ducimus laborum quos vero hic debitis, magni ut
est pariatur praesentium fugiat. Molestiae error ipsa quidem possimus! Tempore nobis labore eius. Quae
quia provident cupiditate, doloribus ipsum qui consectetur.
</p>
</div>
<div>
<h2>Product Two</h2>
<p class="text">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium magnam dolorum quaerat. Architecto
amet ipsam totam reiciendis ipsum voluptatem enim nemo ducimus laborum quos vero hic debitis, magni ut
est pariatur praesentium fugiat. Molestiae error ipsa quidem possimus! Tempore nobis labore eius. Quae
quia provident cupiditate, doloribus ipsum qui consectetur.
</p>
</div>
<div>
<h2>Product Three</h2>
<p class="text">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium magnam dolorum quaerat. Architecto
amet ipsam totam reiciendis ipsum voluptatem enim nemo ducimus laborum quos vero hic debitis, magni ut
est pariatur praesentium fugiat. Molestiae error ipsa quidem possimus! Tempore nobis labore eius. Quae
quia provident cupiditate, doloribus ipsum qui consectetur.
</p>
</div>
</section>
<footer>
<h2>ScrollMagic works!</h2>
</footer>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/plugins/debug.addIndicators.min.js"></script>
<script src="index.js"></script>
</body>
</html>