-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
77 lines (73 loc) · 3.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Movie API</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
</head>
<body>
<div class="topmovie">
<header>
<nav style="position: relative;">
<div class="logo">
<a class="link1" href="http://127.0.0.1:5500/structure.html">Movie API</a>
</div>
<div class="navbar" id="nav">
<p class="link" id="home" >Home</p>
<p class="link" id="tv" >TV</p>
<p class="link" id="popular">Popular</p>
<p class="link" id="toprated">Top Rated</p>
<p class="link" id="login" >Login</p>
</div>
<input type="checkbox" id="check">
<label for="check" class="checkbox">
<i class="fa fa-bars"></i>
</label>
</nav>
</header>
<div class="content" id="content">
<div class="opening">
<h1>WELCOME</h1>
<h2>Get millions of movies,TV shows, and many more.Watch now</h2>
</div>
<form class="search" id="form">
<input type="text" class="searchbar" id="search" placeholder="Search for movies,shows,.......">
</form>
</div>
</div>
<div class="main" id="main">
<div class="movie">
<div class="mov">
<img src="movie-poster.jpg" alt="movie poster">
<div class="overview">
<h3 class="title">Overview</h3>
<h2 class="title"><a href="/" id="movielink">SpiderMan</a></h2>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Omnis, nihil placeat temporibus hic dolorum ea rerum, fugiat quia voluptates dolor quam atque dolores minus voluptatum magni quas sit sint. Deserunt! Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur, reiciendis? Molestiae sunt velit ipsa, asperiores et, dolore repellat nulla tenetur nihil eum, accusantium earum facilis! Quaerat, nemo. Similique, perferendis amet!
Voluptatem commodi nesciunt maxime eos ipsum veniam animi assumenda eaque ullam minima! Vel iste facilis animi est natus ratione! Fuga natus quisquam illum veritatis fugiat dolores tempora porro blanditiis recusandae.</p>
</div>
</div>
<div class="info">
<h3 class="title">spider</h3>
<div class="rating"><span>4.5</span></div>
</div>
</div>
</div>
<div class="pagebox" class="page">
<div class="inpagebox">
<button class="prev" onclick="backward()"><img src="fast-backward 1.png" alt="">prev</button>
<ul class="pageno">
<li class="numbers present" value="1" onclick="presentpage()">1</li>
<li class="numbers" value="2" onclick="presentpage()">2</li>
<li class="numbers" value="3" onclick="presentpage()">3</li>
<li class="numbers" value="4" onclick="presentpage()">4</li>
<li class="numbers" value="5" onclick="presentpage()">5</li>
<li class="numbers" value="6" onclick="presentpage()">6</li>
</ul>
<button class="next" onclick="forward()">next<img src="fast-backward 1.png" alt=""></button>
</div>
</div>
<script src="function.js"></script>
</body>
</html>