I am currently learning p5.js in javascript.
I am trying to make a DVD screensaver in p5.js, and I used one of The Coding Train's videos to help me. However, it doesn't quite work for me.
Here is a link to his video: https://www.youtube.com/watch?v=0j86zuqqTlQ
I use preload() to load the DVD logo, but when I put it in my code, the whole page just turns into "Loading...".
Here is my code:
let x;
let y;
let xspeed;
let yspeed;
let dvd;
function preload() {
dvd = loadImage("dvd.png");
}
function setup() {
createCanvas(800, 600);
x = 400;
y = 300;
xspeed = 10;
yspeed = 10;
}
function draw() {
background(0);
image(dvd, x, y);
x = x + xspeed;
y = y + yspeed;
if (x + 80 == width || x === 0) {
xspeed = -xspeed;
}
if (y + 60 == height || y === 0) {
yspeed = -yspeed;
}
}<!DOCTYPE html><html><head><title>Page Title</title><link rel="stylesheet" type="text/css" href="style.css"></head><body><script src="dvd-screensaver.js"></script><script src="p5.js"></script></body></html>