Skip to main content
Known Participant
November 22, 2019
Question

Play / Pause Video and javascript issue

  • November 22, 2019
  • 3 replies
  • 2271 views

I have a project with a bunch of Videoclips.
I control them with a play and pause button
I also have another button that close down the video.


The Pause Button:
document.getElementsByTagName("video")[0].pause();
document.getElementsByTagName("video")[1].pause();

The Play Button:
document.getElementsByTagName("video")[0].play();
document.getElementsByTagName("video")[1].play();

The Close Button:
document.getElementsByTagName("video")[1].pause();
document.getElementsByTagName("video")[0].pause();
$('[id^=video_1]').hide()

The prpoblem with this scripts are that the Close button just pause the video and hide the layer.
When I then open another video and press play two videos will play. The new one and the one that I closed(hide and paused) by clicking the close button.

So is there a way to disable/close a layer to avoid this problem?

This topic has been closed for replies.

3 replies

thisguy4xapi
Inspiring
November 25, 2019

Once the user closes the video do they need to be able to access again on that slide, or during duration of project?  If not use $('[id^=video_1]').remove()  - That is jquery for remove that element from the DOM.  If you need something more custom or better than that, send me a private message and I will give you an email for me and will help you.....The use of the the javascript keyword 'this' would help to isolate your videos, but I could do it or show you how to do it much easier than trying to do a coding tutorial in forums.

chrismay_at_delta17095116
Inspiring
November 22, 2019

I have found that the only way to show and hide objects via javaScript is to use the Captivate method to do so.

 

 

cp.hide(captivateObjectName);

 

 

where captivateObjectName is the name you give it in the Captivate properties window. 

You can also use jQuery to select the object, like you are doing in your example. just put it inside the parenthesis.

 

cp.hide($('[id^=video_1]'));

 

Known Participant
November 25, 2019

Thank for all the replies.
But wont all this just do the exact same thing. Hide the video object but then when I press play again captivate will play all videos that have once been loaded but hide. If you understand 🙂

Lilybiri
Brainiac
November 25, 2019

I never get in the way of JS experts, although often they seem to like to complicate workflows unnecessarily in my mind. 

 

Are you aware of the fact that you can have event videos (not slide video) in states of a multistate object? You would never have all videos play at once, since you can show only one state.

TLCMediaDesign
Inspiring
November 22, 2019

Your script is playing and pausing 2 videos at once. get a reference to each like so:

var vid_1 = document.getElementsByTagName("video")[0]
vid_1.pause();
var vid_2 = document.getElementsByTagName("video")[1]
vid_2.pause();

 

Then you'd  pause/play a specific video:

vid_1.pause();

vid_2.play();

 

 

Known Participant
November 25, 2019

This might work. 
May I ask where/how I should ad this javascript. Really not that skilled when it comes to javascript :)
Thanx