html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
<head>
<title>Created By Sword</title>
</head>
<body>
<audio id="myAudio">
<source src="https://www.dropbox.com/scl/fi/wv5lsqehg7lrm9zg63hvs/mixkit-multiple-fireworks-explosions-1689.wav?rlkey=1z76c4czkvywzx7xoixl3w3bj&st=s1sezzfu&dl=1" type="audio/mpeg">
</audio>
<canvas id="canvas"></canvas>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
*{
margin:0;
padding:0;
}
body {
}
canvas{
position:fixed ;
}
Enter to Rename, Shift+Enter to Preview
js
js
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
//This code creates a particle animation on a canvas, where particles are created and move towards the mouse position when the mouse is clicked. The particles explode upon reaching the mouse's Y position and gradually fade out.
window.onload = () => {
class Sound{
constructor(){
this.src = document.getElementById("myAudio")
}
}
let sound = [ new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound(), new Sound()
]
// Show an alert when the window loads
alert("click");
// Get the canvas element and its context
const canvas = document.querySelector('canvas');
const c = canvas.getContext('2d');
// Set canvas size to match the window size
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run