2015-07-07 2 views
0

У меня есть видео тег:Показать IFrame или DIV внутри тега видео после окончания видео

<video id="test" autobuffer style="width:100%;" onClick="this.play(); controls> 
     <source src="some file" type="video/mp4"> 

    </video> 

и некоторые Javascript:

<script type='text/javascript'> 
    var video = document.getElementsByTagName('test')[0]; 
     video.onended = function(e) { 
     document.getElementById('test').innerHTML= '<iframe src="http://www.example.com/myframe" width="100" height="100"></iframe>'; 
     }; 
</script> 

Идея заключается в том, когда конец видео (video.onended) просто показать IFrame или div в теге видео. Что-то вроде РЕКЛАМЫ подробнее ..

Я стараюсь, но не Сукчес ..

Tnx,

+0

Обязательно ли показывать это в теге видео? Почему вы не можете заменить элемент видео на свое собственное объявление? – nax83

+0

Нет, не обязательно, но хотелось бы остаться на том месте или выше видеотега ... – pavlenko

+0

Вы должны пойти с некоторой css и javascript (скрыть/показать) логикой, потому что я не думаю, что вы можете манипулировать элементом видео в сюда – nax83

ответ

0

Вы должны заменить весь элемент видео, а не пытаться заменить ребенка в нем. Поэтому использовать parentNode, чтобы получить видеоэлементов родителю

document.getElementById('test').parentNode.innerHTML= '<iframe src="http://www.example.com/myframe" width="100" height="100"></iframe>';

0

Может быть, вы можете сделать так: demo

<div id="test"> 
    <video id="v" controls> 
     <source id='mp4' src="http://media.w3.org/2010/05/sintel/trailer.mp4" type='video/mp4'> 
    </video> 
    <iframe id="overlay" src="http://www.w3schools.com"></iframe> 
</div> 

и добавить стиль

#test { 
    position: relative; 
} 

#overlay { 
    position: absolute; 
    ... 
} 

Вы просто должны добавить JavaScript код, чтобы скрыть, когда видео заканчивается, и это сделает работу, я думаю^^

Смежные вопросы