Skip to content

Commit 4f4fd71

Browse files
v1.2
1 parent acbeca2 commit 4f4fd71

File tree

2 files changed

+162
-0
lines changed

2 files changed

+162
-0
lines changed

index.html

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
2+
<!DOCTYPE html>
3+
<html lang="en" >
4+
<head>
5+
<meta charset="UTF-8">
6+
<title>Welcome To straight-code</title>
7+
<link rel="stylesheet" href="./css/styles.css">
8+
<link href="./assets/straight-code.png" rel="shortcut icon">
9+
</head>
10+
<body>
11+
12+
13+
14+
<!-- Starbackground -->
15+
<div id='stars'></div>
16+
<div id='stars2'></div>
17+
<div id='stars3'></div>
18+
19+
<!-- parallax text/java -->
20+
<div id="parallax">
21+
<div class="layer" data-depth="0.6">
22+
23+
<!-- text -->
24+
<div class="some-space">
25+
<h1>straight-code</h1>
26+
27+
</div>
28+
29+
</div>
30+
<div class="layer" data-depth="0.4">
31+
<div id="particles-js"></div>
32+
</div>
33+
34+
<!-- Button -->
35+
<div class="layer" data-depth="0.3">
36+
<div class="some-more-space1"><a href="straight-code/website/index.html" target="blank">Continue to website</a></div>
37+
</div>
38+
</div>
39+
<script src="./script.js"></script>
40+
41+
</body>
42+
</html>

script.js

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
$('#parallax').parallax({
2+
invertX: true,
3+
invertY: true,
4+
scalarX: 15,
5+
frictionY: .1
6+
});
7+
8+
9+
particlesJS("particles-js", {
10+
"particles": {
11+
"number": {
12+
"value": 120,
13+
"density": {
14+
"enable": true,
15+
"value_area": 800
16+
}
17+
},
18+
"color": {
19+
"value": "#ffffff"
20+
},
21+
"shape": {
22+
"type": "circle",
23+
"stroke": {
24+
"width": 0,
25+
"color": "#000000"
26+
},
27+
"polygon": {
28+
"nb_sides": 5
29+
},
30+
"image": {
31+
"src": "img/github.svg",
32+
"width": 100,
33+
"height": 100
34+
}
35+
},
36+
"opacity": {
37+
"value": 0.5,
38+
"random": false,
39+
"anim": {
40+
"enable": false,
41+
"speed": 1,
42+
"opacity_min": 0.1,
43+
"sync": false
44+
}
45+
},
46+
"size": {
47+
"value": 3,
48+
"random": true,
49+
"anim": {
50+
"enable": false,
51+
"speed": 40,
52+
"size_min": 0.1,
53+
"sync": false
54+
}
55+
},
56+
"line_linked": {
57+
"enable": true,
58+
"distance": 150,
59+
"color": "#ffffff",
60+
"opacity": 0.4,
61+
"width": 1
62+
},
63+
"move": {
64+
"enable": true,
65+
"speed": 6,
66+
"direction": "none",
67+
"random": false,
68+
"straight": false,
69+
"out_mode": "out",
70+
"bounce": false,
71+
"attract": {
72+
"enable": false,
73+
"rotateX": 600,
74+
"rotateY": 1200
75+
}
76+
}
77+
},
78+
"interactivity": {
79+
"detect_on": "canvas",
80+
"events": {
81+
"onhover": {
82+
"enable": true,
83+
"mode": "grab"
84+
},
85+
"onclick": {
86+
"enable": true,
87+
"mode": "push"
88+
},
89+
"resize": true
90+
},
91+
"modes": {
92+
"grab": {
93+
"distance": 140,
94+
"line_linked": {
95+
"opacity": 1
96+
}
97+
},
98+
"bubble": {
99+
"distance": 400,
100+
"size": 40,
101+
"duration": 2,
102+
"opacity": 8,
103+
"speed": 3
104+
},
105+
"repulse": {
106+
"distance": 200,
107+
"duration": 0.4
108+
},
109+
"push": {
110+
"particles_nb": 4
111+
},
112+
"remove": {
113+
"particles_nb": 2
114+
}
115+
}
116+
},
117+
"retina_detect": true
118+
});
119+
120+

0 commit comments

Comments
 (0)