-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
100 lines (92 loc) · 3.37 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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="https://unpkg.com/sheryjs/dist/Shery.css" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="main">
<div id="back">
<img src="IMG_7564.JPG" alt="" />
<img src="IMG_7565.JPG" alt="" />
<img src="IMG_7566.JPG" alt="" />
<img src="IMG_7567.JPG" alt="" />
<img src="IMG_7568.JPG" alt="" />
</div>
<div id="top">
<div id="workingarea">
<div id="nav">
<div id="nleft">
<img src="raybanlogo.png" alt="" />
<a href="#">products</a>
<a href="#">about</a>
</div>
<div id="nright">
<a href="#">LUXE</a>
<a href="#">pricing</a>
</div>
</div>
<div id="hero">
<div id="heroleft">
<div class="elem">
<h1>david chang</h1>
<h1>samuel wants</h1>
<h1>susan qu</h1>
<h1>Resha thinks</h1>
<h1>this is insane</h1>
</div>
<div class="elem">
<h1>gives zero</h1>
<h1>to live his</h1>
<h1>indifference is</h1>
<h1>how that is</h1>
<h1>top notch</h1>
</div>
<div class="elem">
<h1>funks.</h1>
<h1>life.</h1>
<h1>absolute</h1>
<h1>happened</h1>
<h1>next level</h1>
</div>
<button>Explore Now</button>
</div>
<div id="heroright">
<p>Lorem ipsum dolor sit amet.</p>
<div id="imagediv"></div>
<p>
Lorem ipsum dolor, sit amet consectetur adipisicing elit. A
explicabo velit illum? Vero illo fuga aspernatur illum dolor
obcaecati recusandae nobis id quam ullam consectetur velit
repellendus amet similique nam facilis enim unde nulla,
reiciendis magnam! Sed ducimus adipisci tenetur iusto odio eius
dolores.
</p>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit.
Voluptatum, maxime veritatis, quia commodi quaerat nemo nulla
iusto aut repellat ea tenetur at iure.
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Gsap is needed for Basic Effects -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
<!-- Scroll Trigger is needed for Scroll Effects -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js"></script>
<!-- Three.js is needed for 3d Effects -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/0.155.0/three.min.js"></script>
<!-- ControlKit is needed for Debug Panel -->
<script src="https://cdn.jsdelivr.net/gh/automat/controlkit.js@master/bin/controlKit.min.js"></script>
<script
type="text/javascript"
src="https://unpkg.com/sheryjs/dist/Shery.js"
></script>
<script src="script.js"></script>
</body>
</html>