-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
67 lines (64 loc) · 4.58 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
60
61
62
63
64
65
66
67
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Parallax Scrolling Effect Website</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h2 class="logo">Logo</h2>
<nav class="navigation">
<a href="#" class="active">Home</a>
<a href="#">About</a>
<a href="#">Service</a>
<a href="#">Contact</a>
</nav>
<div class="menu-toggle" onclick="toggleMenu()"></div>
</header>
<section class="parallax">
<img src="Images/hill1.png" id="hill1">
<img src="Images/hill2.png" id="hill2">
<img src="Images/hill3.png" id="hill3">
<img src="Images/hill4.png" id="hill4">
<img src="Images/hill5.png" id="hill5">
<img src="Images/tree.png" id="tree">
<img src="Images/leaf.png" id="leaf">
<img src="Images/plant.png" id="plant">
<h2 id="text">Parallax Website</h2>
</section>
<section class="sec">
<h2>Parallax Scrolling Website</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos dolore voluptatem sapiente rerum molestias, dele
ctus adipisci tempore ipsam omnis, molestiae hic consequuntur facere deserunt accusantium ex veritatis esse quam at.
Fugiat recusandae aliquam, molestiae eum quasi aperiam, quas maiores enim consequuntur fuga, sunt nesciunt voluptates nemo cum corporis ad autem cupiditate vitae quae architecto deserunt provident.
Laborum aperiam omnis nemo, culpa praesentium nisi. Ex dolorem adipisci delectus doloremque, perferendis, laborum sit est porro officiis in totam facere necessitatibus vel ab neque? Velit cumque quia
repudiandae laudantium architecto quo inventore nam neque ducimus ipsa, aspernatur fugit quidem recusandae ea voluptates, id quam! Accusantium rem numquam doloremque nisi voluptas consequuntur repellendus
molestiae eveniet et asperiores nostrum hic sint ex temporibus itaque consequatur ea minima dolorem fugiat obcaecati, libero ratione neque! Voluptatem, blanditiis!
<br><br>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos dolore voluptatem sapiente rerum molestias, dele
ctus adipisci tempore ipsam omnis, molestiae hic consequuntur facere deserunt accusantium ex veritatis esse quam at.
Fugiat recusandae aliquam, molestiae eum quasi aperiam, quas maiores enim consequuntur fuga, sunt nesciunt voluptates nemo cum corporis ad autem cupiditate vitae quae architecto deserunt provident.
Laborum aperiam omnis nemo, culpa praesentium nisi. Ex dolorem adipisci delectus doloremque, perferendis, laborum sit est porro officiis in totam facere necessitatibus vel ab neque? Velit cumque quia
repudiandae laudantium architecto quo inventore nam neque ducimus ipsa, aspernatur fugit quidem recusandae ea voluptates, id quam! Accusantium rem numquam doloremque nisi voluptas consequuntur repellendus
molestiae eveniet et asperiores nostrum hic sint ex temporibus itaque consequatur ea minima dolorem fugiat obcaecati, libero ratione neque! Voluptatem, blanditiis!
<br><br>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos dolore voluptatem sapiente rerum molestias, dele
ctus adipisci tempore ipsam omnis, molestiae hic consequuntur facere deserunt accusantium ex veritatis esse quam at.
Fugiat recusandae aliquam, molestiae eum quasi aperiam, quas maiores enim consequuntur fuga, sunt nesciunt voluptates nemo cum corporis ad autem cupiditate vitae quae architecto deserunt provident.
Laborum aperiam omnis nemo, culpa praesentium nisi. Ex dolorem adipisci delectus doloremque, perferendis, laborum sit est porro officiis in totam facere necessitatibus vel ab neque? Velit cumque quia
repudiandae laudantium architecto quo inventore nam neque ducimus ipsa, aspernatur fugit quidem recusandae ea voluptates, id quam! Accusantium rem numquam doloremque nisi voluptas consequuntur repellendus
molestiae eveniet et asperiores nostrum hic sint ex temporibus itaque consequatur ea minima dolorem fugiat obcaecati, libero ratione neque! Voluptatem, blanditiis!<br><br>
</p>
</section>
<script src="script.js" defer></script>
<script>
function toggleMenu() {
var navigation = document.querySelector('.navigation');
navigation.classList.toggle('active');
}
</script>
</body>
</html>