Change Video Source using Buttons

Question

So I've run into some trouble in a larger project so I decided to troubleshoot but creating a smaller project and am still running into issues. Here's the situation. I want to have two buttons (button01 and button02) and one video object (generic_video). Click one button, and the source of the video changes to let's say a local video, somevideo.mp4. Click button02 and the video source changes to someothervideo.mp4. I have the buttons set up and named and a singular video component. My code would look like:

this.Button01.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler()

{

var videoURL = "c:/images-tv.adobe.com/somevideo.mp4";

this.generic_video.on("added", function() {

$("#generic_video")[0].src=videoURL;

}, this, true);

}

and

this.Button02.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler()

{

var videoURL = "c:/images-tv.adobe.com/someothervideo.mp4";

this.generic_video.on("added", function() {

$("#generic_video")[0].src=videoURL;

}, this, true);

}

Except, this doesn't work. At all. I run a test and the video box stays empty with nothing in it. No source.

JoãoCésar17023019 · Accepted Answer

Hi. This works for me:  function changeVideoSource(){document.getElementById("yourVideo").src="video.mp4";}this.yourButton.on("click", changeVideoSource);  Make sure you have permisssions to load the video from the folder where it is. I would just place the video in the same folder as the index.html and use a simple relative path. Regards,JC

kglad · Answer

the first error i see is duplicate function names.then all the "added" code should be removed.  it's too late for that.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.