-
Notifications
You must be signed in to change notification settings - Fork 6
/
index.html
37 lines (31 loc) · 2.57 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
<!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">
<title>Sliding images!!</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="modal-container">
<div id="modal-content">
<img id="modal-image" src="" alt="Full-Screen Image">
<span id="close-modal">×</span>
</div>
</div>
<section id="image-track" data-mouse-down-at="0" data-prev-percentage="0">
<img src="https://cdn.discordapp.com/attachments/1064028865741197413/1162435067814105188/grnkrby_Neo-noir_with_a_vibrant_gay_aesthetic_the_colors_clash__3ee5df91-26f6-4044-a2e7-f47fc54be472.png?ex=653bed05&is=65297805&hm=d664de2acb9316ee5d7242a6b976e3a813fd593ec4c9ff07484ce89b8eda1869&" class="image" draggable="false">
<img src="https://cdn.discordapp.com/attachments/1008571084225912872/1161746566466502756/oddmysteries_Urban_Beach_Weekend_in_Miami_photorealistic_8e57de16-3619-4c65-976b-968f13a8317c.png?ex=65396bcd&is=6526f6cd&hm=427ca3cfc509cdb9bc03bb7f1753db5d51fd51cf7719c521acfe2ab40dfb61bd&" class="image" draggable="false">
<img src="https://cdn.discordapp.com/attachments/1008571084225912872/1161720135191625748/bandupcyrie_80721_a_scary_story_youtube_thumbnail_of_a_man_driv_4a8af124-89c3-4c2d-925e-c4aa1cc745bf.png?ex=6539532f&is=6526de2f&hm=c76da6d4a49976f1728ead27816b16e4db0b4f554d61f45ae3918a3716793018&" class="image" draggable="false">
<img src="https://images.unsplash.com/photo-1677688010633-138cea460828?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwyMHx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60" class="image" draggable="false">
<img src="https://images.unsplash.com/photo-1677618031630-768ddc4f4fad?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwyNHx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60" class="image" draggable="false">
<img src="https://images.unsplash.com/photo-1661956601349-f61c959a8fd4?ixlib=rb-4.0.3&ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwzMXx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60" class="image" draggable="false">
<img src="https://images.unsplash.com/photo-1677629828024-7793ff7d9403?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHw1OHx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60" class="image" draggable="false">
</section>
<section id="header">
<h1>Project<span style="color: rgb(175, 0, 250);">X</span></h1>
</section>
<script src="index.js"></script>
</body>
</html>