Is it possible to set up simple play and pause controls outside of the video itself?
I ask this question as a possible solution to a previous problem i need solving (which follows).
I have one page of videos that are anchors to each other on the page. So if you click on the first video it slides down to the next and so on. However, because they are anchors the controls can not be clicked on. How can I get around this problem?
OK I realise the solution is probably with jQuery. I need an anchor next to the video that when clicked it triggers the video to play, then the text 'play' changes to 'pause' so then on click event it triggers the video to pause.
Got this so far, but how do i change the button to an anchor?
function vidplay() {
var video = document.getElementById("Video1");
var button = document.getElementById("play");
if (video.paused) {
video.play();
button.textContent = "||";
} else {
video.pause();
button.textContent = ">";
}
}
function restart() {
var video = document.getElementById("Video1");
video.currentTime = 0;
}
function skip(value) {
var video = document.getElementById("Video1");
video.currentTime += value;
}
// Replace these with your own video files.
HTML5 Video is required for this example.
Download the video file.
Is it possible to set up simple play and pause controls outside of the video itself?
I ask this question as a possible solution to a previous problem i need solving (which follows).
I have one page of videos that are anchors to each other on the page. So if you click on the first video it slides down to the next and so on. However, because they are anchors the controls can not be clicked on. How can I get around this problem?
this is the page http://kimcolemanprojects.com/djangolive_1.html
Thanks for any help.
Angela
OK I realise the solution is probably with jQuery. I need an anchor next to the video that when clicked it triggers the video to play, then the text 'play' changes to 'pause' so then on click event it triggers the video to pause.
Anyone know how to write this? Thanks :)
Got this so far, but how do i change the button to an anchor?
function vidplay() { var video = document.getElementById("Video1"); var button = document.getElementById("play"); if (video.paused) { video.play(); button.textContent = "||"; } else { video.pause(); button.textContent = ">"; } } function restart() { var video = document.getElementById("Video1"); video.currentTime = 0; } function skip(value) { var video = document.getElementById("Video1"); video.currentTime += value; }// Replace these with your own video files. HTML5 Video is required for this example. Download the video file.