Hi!
I hope you are enjoying Hacktoberfest with lots of different projects.
Project
This week I contributed to React JS project. In this project you can create a meeting via Calendly and join other meetings as well.
Issue
For my Issue, I had to add dynamic background image to the app, so that background image is changing every 10 seconds.
Solution
For my PR I added a function that would change the background image:
const [counter, setCounter] = useState(0);
const [backgroundClass, setBackgroundClass] = useState("");
const backgroundImages = [
"backgroundImage1",
"backgroundImage2",
"backgroundImage3",
"backgroundImage4",
"backgroundImage5",
];
function changeBackgroundImage() {
if (counter === 4) {
setCounter(0);
} else {
setBackgroundClass(backgroundImages[counter]);
setCounter(counter + 1);
}
}
useEffect(() => {
setTimeout(() => {
changeBackgroundImage();
}, 10000);
}, [counter]);
Summary
It took some time for me to find the way to implement that feature, but it was a great experience!
Top comments (0)