deblan/romeo-boom
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Youhouuuu

Browse source
This commit is contained in:
Simon Vieille 2024-01-22 16:43:25 +01:00
commit 637bcac883
No known key found for this signature in database
GPG key ID: 477F8D32E8E286EB
4 changed files with 103 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
12420.mp3 Normal file
View file

Binary file not shown.

48
design.css Normal file
View file

@ -0,0 +1,48 @@
body {
font-family: Verdana;
}
h1 {
color: red;
}
p {
border: 10px dotted blue;
padding: 20px;
box-shadow: 0 0 50px green;
transition: box-shadow 1s;
}
p:hover {
box-shadow: 0 0 20px yellow;
}
img {
transition: transform 3s;
}
img:hover {
transform: rotate(360deg);
}
.exploison {
background: yellow;
border-radius: 100%;
animation: boom 2s ease-in-out;
position: absolute;
}
@keyframes boom {
from {
width: 0px;
height: 0px;
margin-left: 0;
margin-top: 0;
}
to {
width: 200px;
height: 200px;
margin-left: -100px;
margin-top: -100px;
}
}

35
index.html Normal file
View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Une page d'exemple</title>
<link rel="stylesheet" href="design.css">
</head>
<body>
<h1>Titre</h1>
<p>Quis consequat incididunt sunt exercitation eiusmod aliqua qui nisi in ipsum. Ut ea anim ipsum incididunt nostrud pariatur duis et nulla culpa mollit qui ad. Aliquip in proident reprehenderit elit ad Lorem ipsum commodo non qui pariatur in et fugiat.</p>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
<p>
<a href="https://www.youtube.com/">Youtube</a>
</p>
<img src="https://www.deblan.io/uploads/content/658/screenshot_20231106.png" width="300">
<script src="shootgun.js"></script>
</body>
</html>

20
shootgun.js Normal file
View file

@ -0,0 +1,20 @@
document.addEventListener('click', (e) => {
const sourisX = e.clientX
const sourisY = e.clientY
const son = new Audio("12420.mp3")
son.addEventListener("canplaythrough", (event) => {
son.play()
})
window.setTimeout(() => {
e.target.style.display = 'none'
}, 1500)
const exploison = document.createElement('div')
exploison.classList.add('exploison')
exploison.style.left = `${sourisX}px`
exploison.style.top = `${sourisY}px`
document.body.appendChild(exploison)
})