forked from Vishal-raj-1/Awesome-JavaScript-Projects
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
141 lines (133 loc) · 6.74 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
130
131
132
133
134
135
136
137
138
139
140
141
<!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.0">
<meta name="description" content="Awesome JavaScript Projects, the platform which helps developer to get set go with their learning or making their life easier with premade projects.">
<title>Awesome JavaScript | Home</title>
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="shortcut icon" href="./assets/Images/favicons/faviconss.png">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<!--Sticky Sidebar-->
<div class="icon-bar">
<a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
<a href="#" class="google"><i class="fa fa-google"></i></a>
<a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
<a href="#" class="youtube"><i class="fa fa-youtube"></i></a>
</div>
<!--CSS Preloader-->
<div id="spinner-wrapper">
<div class="sk-folding-cube">
<div class="sk-cube1 sk-cube"></div>
<div class="sk-cube2 sk-cube"></div>
<div class="sk-cube4 sk-cube"></div>
<div class="sk-cube3 sk-cube"></div>
</div>
</div>
<a id="goToTop" href="#top">
<i class="fa fa-arrow-up" aria-hidden="true"></i>
</a>
<main id="top">
<!-- Header -->
<header>
<nav>
<h2><a href="index.html">Awesome JavaScript</a></h2>
<i class="fa fa-bars" aria-hidden="true" id="menuBar" onclick="menu()"></i>
<i class="fa fa-times" aria-hidden="true" id="menuClose" onclick="menuClose()"></i>
<ul id="menu">
<li><a href="#" class="active">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="contact.html">Contact</a></li>
<a href="https://github.com/Vishal-raj-1/Awesome-JavaScript-Projects" target="_blank" class="github githubs"><i class="fa fa-github" aria-hidden="true"></i></a>
</ul>
</nav>
<div class="bannerSection">
<div class="bannerText">
<h1>JavaScript Projects <br> that you need!!</h1>
<h2>The great collection of JavaScript projects, <br>just for you!!!</h2>
<div class="buttonCenter">
<a href="#about" class="commanBtn">Get Started</a>
<a href="https://github.com/Vishal-raj-1/Awesome-JavaScript-Projects" target="_blank" class="github" ><i class="fa fa-github" aria-hidden="true"></i> Github</a>
</div>
</div>
<div class="bannerIllustration">
<img src="./assets/Images/homeaat.png" alt="Main Banner Illustration">
</div>
</div>
</header>
<!-- Header Close -->
<!-- Added About -->
<section class="body" id= "about">
<h1>About Us</h1>
<hr>
<div class="dualSections">
<div class="dualSectionsText">
<p>
This platform is build by JavaScript Developers around the world to make learning JavaScript easy for the newbies. <br> <br>
This is the open source JavaScript project, which you can work on in GitHub.
It will help you, clear your javascript doubts. You can use this projects for you fulfilling your need.
</p>
<a href="contact.html">Contact Us</a>
</div>
<div class="dualSectionImg">
<img src="./assets/Images/shortAbout.svg" alt="About Illustration">
</div>
</div>
</section>
<!-- About Close -->
<!-- Added Project -->
<section class="homeProjects">
<div class="projectArea">
<div class="projectCard">
<a href="./public/Analogclock.html" class="hoverEffect" target="_blank">
<img
class="projectCardImg"
src="./assets/GIFs/analogClock.gif"
alt="Analogue Clock Project"
/>
<h5 class="projectCardTitle">Analog Clock</h5>
<span class="computerLegs"></span>
<span class="computerBase"></span>
</a>
</div>
</div>
<div class="projectDescription">
<h1>JavaScript Projects</h1>
<hr>
<p>JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm. It has curly-bracket syntax, dynamic typing, prototype-based object-orientation, and first-class functions. <br><br>
Click on the below given button top surf the Awesome JavaScript Projects, that can help you in many ways as per your need. So, get set go.
</p>
<a href="projects.html" class="button">More Projects</a>
</div>
</section>
<!-- Project Close -->
<!-- Added Call to Action -->
<div class="CTA">
<div class="ctaText">
<h1>Let's get started...</h1>
<p>Awesome JavaScript is the open source project that helps you in JavaScript Projects. Conatact us if you want to suggest the project that can be implemented in order to add in the website.</p>
</div>
<div class="ctaButton">
<a href="contact.html">Contact Now</a>
</div>
<img src="./assets/Images/contactCTA.png" alt="Contact Man">
</div>
<!-- Closed Call to Action -->
<!-- Added Footer -->
<footer>
<p>© <script type="text/javascript">
document.write(new Date().getFullYear());
</script> Copyright. <b>Awesome JavaScript Project</b>. All Rights Reserved.</p>
<p>Design by <a href="https://cratonik.com" target="_blank" rel="follow">Cratonik</a></p>
</footer>
<!-- Closed Footer -->
</main>
</body>
<script src="./assets/js/scripts.js"></script>
</html>