Video Html5 with advertisement

Asked

Viewed 252 times

1

I have a code to put an ad in video 5 seconds, but I can’t put it on top of the video in the right corner, I can use css but with full screen it doesn’t work, someone has an idea

var media = document.getElementById("media");

function secToStr( sec_num ) {
    sec_num = Math.floor( sec_num );
    var horas   = Math.floor(sec_num / 3600);
    var minutos = Math.floor((sec_num - (horas * 3600)) / 60);
    var segundos = sec_num - (horas * 3600) - (minutos * 60);

    if (segundos < 10) {segundos = segundos;}

	switch(segundos) {
	    case 0: segundos = 5; break;
	    case 1: segundos = 4; break;
	    case 2: segundos = 3; break;
	    case 3: segundos = 2; break;
	    case 4: segundos = 1; break;
	    case 5: segundos = 0; break;
	}
	    if (segundos>5) segundos = 0;

    return segundos;
}


media.ontimeupdate = function() {
	segundos = secToStr(media.currentTime);    

    if (media.duration == media.currentTime) { 
    	media.src= "http://rodrigoti.com.br/novo/2.mp4";
    	media.play();
    	$("button").hide();
    };

    if (segundos < 1) { 
    	segundos = "";
    	$("button").html("Pular");
    	$("button").click(function(){   
		    media.src= "http://rodrigoti.com.br/novo/2.mp4";
		    media.play();
    	$("button").hide();      
		});
    }else{
    	$("button").html("Pular video em "+segundos+ " segundos" );
    	 
    }

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<button>Pular video em 5 segundos</button> <br>
<video id="media" autoplay width="320" height="240" controls>
  <source src="http://rodrigoti.com.br/novo/1.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

  • Ué...and how is it done on youtube?

  • I think in the video itself. If it were different it would already be in the mouth of the programmers and we would find the script easily

  • Did you run the example? is in the video itself, but I will try to put a div on top of it and put the function and disable the fullscreen, only enable the fullscreen after advertising

  • You can already open the video in full screen with an html on top.

  • see kithomepage.com/sos/Tester.htm. click on the image to add it. If you do not click it disappears after a few seconds

  • further elaborated, http://kithomepage.com/sos/tester3.htm

  • I got...thank you very much, I put the html on top and it worked, it was similar to youtube :)

  • You did the same as my example, already opening in full screen or figured out how to put html by clicking the full screen button?

Show 3 more comments
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.