Karlis
Karlis

Reputation: 1501

jQuery/javascript hide video element

Is it possible somehow in jQuery to hide specific video or source element?

<video id="one" autoplay width="300px" height="300px">
      <source src="media/sample3.mp4" type="video/mp4" />
    </video>
    <video id="two" autoplay width="300px" height="300px">
      <source src="media/sample.mp4" />
    </video>

I would like to play sample3, for example, for 1 minute, then pause sample3, hide it, show sample.mp4 and play that video.

Any suggestons?

My code which I tryed:

var video = $('video').get(0).pause();
  if ($('video').get(0).paused) { 
    $('video').get(0).hide();
  };

but the $('video').get(0).hide(); throws Uncaught TypeError: Object #<HTMLVideoElement> has no method 'hide'

Upvotes: 0

Views: 3442

Answers (1)

Kaarel
Kaarel

Reputation: 170

I would try something like this

$(document).ready(function(){
    var one = $('#one');
    var two = $('#two');
    play_sound(one);
    setTimeout(function(){
        pause_sound(one);
        one.hide();
        two.show();
        play_sound(two);
        setTimeout(function(){
            pause_sound(two);
        }, 180*1000);
    }, 60*1000);
});

function play_sound(var file){
    file.play();
}

function pause_sound(var file){
    file.pause();
}

Upvotes: 1

Related Questions