-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
77 lines (69 loc) · 2.77 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
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<title>JQUERY</title>
</head>
<body>
<div id="container">
<header>
<h1>JQUERY</h1>
</header>
</div>
<div id="Ex1">
<button class="btn" id="btn1" type="button">Click to Hide</button>
<button class="btn" id="btn2" type="button">Click to show</button>
<button class="btn" id="btn3" type="button">Click to change color</button>
<div id="par1">
<p>
jQuery is a fast, small, and feature-rich JavaScript library.
It makes things like HTML document traversal and manipulation, event handling,
animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
With a combination of versatility and extensibility,
jQuery has changed the way that millions of people write JavaScript.
</p>
</div>
</div>
<!-- ========================Ex1============================ -->
<div id="Ex2">
<button class="btn" id="btn4" type="button">Fade In</button>
<button class="btn" id="btn5" type="button">Fade Out</button>
<div id="par2">
<p>
jQuery's syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax applications.
jQuery also provides capabilities for developers to create plug-ins on top of the JavaScript library.
This enables developers to create abstractions for low-level interaction and animation, advanced effects and high-level,
themeable widgets. The modular approach to the jQuery library allows the creation of powerful dynamic web pages and Web applications.
</p>
</div>
</div>
<!-- ========================Ex2============================ -->
<div id="Ex3">
<button class="btn" id="btn6" type="button">Slide UP</button>
<button class="btn" id="btn7" type="button">Slide Down</button>
<div id="box">
<p>
* jQuery is a JavaScript Library.</br>
* jQuery greatly simplifies JavaScript programming.</br>
* jQuery is easy to learn.</br>
</p>
</div>
</div>
<!-- =========================Ex3=========================== -->
<div id="Ex4">
<button class="btn" id="btn8" type="button">Animate</button>
<div class="login-wrap">
<h2>Login</h2>
<div class="form">
<input type="text" placeholder="Username" id="un" />
<input type="password" placeholder="Password" id="pw" />
<button id="btn9"> Sign in </button>
<a href="#"> <p> Don't have an account? Register </p></a>
</div>
</div>
</div>
<script src="jquery-3.3.1.min.js"></script>
<script src="script.js"></script>
</body>
</html>