I'm currently in the process of putting together a Video gallery playlist using HTML, CSS, and JavaScript. So far, I've set up the html and css files along with two js files.
The first js file contains all the video information as shown here:
let allVideos = [
{
name: "Button Hover Effect",
src: "https://youtu.be/ykuD2QOZkhc",
id: "vid_1"
},
...
{
name: "Vertical Navigation Bar",
src: "https://youtu.be/ykuD2QOZkhc",
id: "vid_13"
}
]The second js file is dedicated to the playlist script:
const mainVideo = document.querySelector('#main-Video');
...
function clicked(element){
let getIndex = element.getAttribute("li-index");
musicIndex = getIndex;
loadMusic(musicIndex);
playMusic();
playingNow();
}Everything seems to be functioning correctly except for the video source links in the "all Videos" javascript file. They aren't working as expected. Can someone provide assistance in resolving this issue?