commit 637bcac8833a4a78f28c70fb62c33998df147606 Author: Simon Vieille Date: Mon Jan 22 16:43:25 2024 +0100 Youhouuuu diff --git a/12420.mp3 b/12420.mp3 new file mode 100644 index 0000000..f10f8e6 Binary files /dev/null and b/12420.mp3 differ diff --git a/design.css b/design.css new file mode 100644 index 0000000..24f1955 --- /dev/null +++ b/design.css @@ -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; + } +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..a8b2402 --- /dev/null +++ b/index.html @@ -0,0 +1,35 @@ + + + + + Une page d'exemple + + + + +

Titre

+ +

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.

+ + + +
    +
  1. Item 1
    2. +
  2. Item 2
    3. +
  3. Item 3
    4. +
+ +

+ Youtube +

+ + + + + + + diff --git a/shootgun.js b/shootgun.js new file mode 100644 index 0000000..0c9ae4f --- /dev/null +++ b/shootgun.js @@ -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) +})