-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
129 lines (123 loc) · 6.66 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
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home | prakarsh®️</title>
<link rel="shortcut icon" href="https://www.rejouice.com/assets/favicon/favicon-32x32.png" type="image/x-icon">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/locomotive-scroll.css">
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
/>
<link rel="stylesheet" href="style.css" >
</head>
<body>
<div id="loader">
<h3>Welcome</h3>
<h3>to</h3>
<h3>My</h3>
<h3>Website </h3>
</div>
<div id="main">
<div id="page1">
<div id="cursor">
<h5>Play Reel</h5>
</div>
<video autoplay loop muted src="./bg.mp4"></video>
<div id="page1-content">
<nav>
<h3>
The Venture Agency.
</h3>
<h4>
Menu
</h4>
</nav>
<h1><span>p</span><span>r</span><span>a</span><span>k</span><span>a</span><span>r</span><span>s</span><span>h</span></h1>
</div>
</div>
<div id="page2">
<div id="page2-top">
<h3>A brand accelerator
With two engagement models</h3>
<h4>Pairs & San Diego</h4>
</div>
<div class="elem">
<h1>We are a digital brand accelerator curating dream
teams for dream clients. We design ,
develop , and scale market-defining brands.
Choose full cash compensation or offset up to 50%
of our fees for equity in your company . Your vision ,
your decision.
</h1>
</div>
</div>
<div id="page3">
<div id="page3-top">
<h4>Agency & Venture <span>Models</span></h4>
<h2>Explore Our Services</h2>
<h2>& engagement models</h2>
</div>
<div id="page3-elements">
<div class="box">
<img src="./img1.avif" alt="">
<video autoplay loop muted src="./vide1.mp4"></video>
</div>
<div class="box">
<img src="./img2.avif" alt="">
<video autoplay loop muted src="./vide2.mp4"></video>
</div>
<div class="box">
<img src="./img3.avif" alt="">
<video autoplay loop muted src="./vide3.mp4"></video>
</div>
</div>
<div id="page4">
<video autoplay loop muted src="./RJ-BALL-BLUE-ORANGE-scaled.webm"></video>
<svg class="abs tl:0 fit transform rotate:-90deg" viewBox="0 0 100 100">
<circle cx="50" cy="50" r="49" stroke="#fff" stroke-width="0.25" fill="none" class="o:0.3 $$2$$ $$3$$ $$4$$ (.in-view):tween:all,2.8s,easeOutSlow dasharray:308 dashoffset:616 (.in-view):dashoffset:431.20000000000005"></circle>
<circle cx="50" cy="50" r="49" stroke="#fff" stroke-width="0.25" fill="none" class="$$5$$ $$6$$ $$7$$ (.in-view):tween:all,2.8s,easeOutSlow dasharray:308 dashoffset:308 (.in-view):dashoffset:123.2"></circle>
</svg>
<svg class="abs tl:0 fit transform rotate:0 $$8$$ (.in-view):tween:all,2.8s,easeOutSlow (.in-view):rotate:216deg" viewBox="0 0 100 100">
<circle cx="50" cy="1" r="1" fill="#fff"></circle>
</svg>
</div>
<div id="page5">
<div id="page5-top">
<h1>Get in Touch.</h1>
<div id="swipperdiv">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="https://images.unsplash.com/photo-1704841632563-b40ffa74ae09?q=80&w=1887&auto=format&fit=crop
&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdl
fHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1682687980115-a37b56ea7271?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHw4MXx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1699173943779-388fe0c16d94?q=80&w=1748&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1682686579976-879b74d6d7ea?q=80&w=1767&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1704574155820-47a04256005d?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
</div>
<div class="swiper-slide">
<img src="https://images.unsplash.com/photo-1704841632563-b40ffa74ae09?q=80&w=1887&auto=format&fit=crop
&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdl
fHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1682687980115-a37b56ea7271?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHw4MXx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1699173943779-388fe0c16d94?q=80&w=1748&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1682686579976-879b74d6d7ea?q=80&w=1767&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
<img src="https://images.unsplash.com/photo-1704574155820-47a04256005d?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/locomotive-scroll.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.4/gsap.min.js" integrity="sha512-EZI2cBcGPnmR89wTgVnN3602Yyi7muWo8y1B3a8WmIv1J9tYG+udH4LvmYjLiGp37yHB7FfaPBo8ly178m9g4Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.4/ScrollTrigger.min.js" integrity="sha512-OzC82YiH3UmMMs6Ydd9f2i7mS+UFL5f977iIoJ6oy07AJT+ePds9QOEtqXztSH29Nzua59fYS36knmMcv79GOg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="scritpt.js"></script>
</body>
</html>