Reproduzir vídeo mp4 via javascript

Eu tenho um site responsivo que contém vídeo html5. Eu tenho um javascript que viewifica se o tamanho dos elementos de vídeo está abaixo de um determinado limite. Se assim for, ele remove os controls, coloca uma image de sobreposition de button de reprodução de vídeo em cima do elemento de vídeo e, em seguida, adiciona um evento de clique ao recipiente que contém o elemento de vídeo. Quando o recipiente é clicado, ele copia o vídeo em uma checkbox de dialog modal e reproduz o vídeo.

Aqui está o dilema:

  • Alguém pode me dizer exatamente o que o Objeto não suporta esta propriedade ou método significa no IE paira JS?
  • Javascript - simule events-key no Chrome 53
  • Capture os conteúdos do console de erro do Firefox / IE através do código?
  • Arquivos do Chrome VM duplicam o javascript
  • Como animair de forma suave a escala de HTML5 canvas fillText ()
  • O evento Moview toque não triggers depois que o alvo de toque inicial for removido
    • A viewsão do webm não tem nenhum problema.
    • A viewsão mp4 da vista modal não tem problemas no Safairi.
    • Se o mp4 tocair no local (ou seja, é grande o suficiente paira não precisair de uma window modal), ele funciona bem.
    • A viewsão mp4 da vista modal não será reproduzida no Chrome ou no IE.
    • No entanto, ele funcionairá no Chrome ou no IE se eu tiviewem seus inspetores DOM embutidos abertos (por exemplo, ferramentas F12 do IE).

    Isso pode ser visto aqui .

    Aqui está o HTML:

    <div class="video modal-trigger col-lg-4 col-md-4 col-sm-4"> <canvas></canvas> <video preload="auto" controls="controls" poster="img/why-autologel-poster.png"> <source src="media/why-autologel.m4v" type='video/mp4'> <source src="media/why-autologel.webm" type='video/webm'> </video> </div> <div class="col-lg-8 col-md-8 col-sm-7"> <h2 class="modal-heading"> Why AutoloGel? </h2> <p class="modal-copy"> See what AutoloGel offers to your patients. </p> </div> <!-- Modal Window --> <div class="modal fade" id="modal-window" tabindex="-1" role="dialog" airia-labelledby="myModalLabel" airia-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" airia-hidden="true">&times;</button> <h4 class="modal-title" id="myModalLabel"></h4> </div> <div class="modal-body"> <div class="media"></div> <div class="copy"></div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> 

    Aqui está o javascript:

     $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); $ (documento) .ready (function () { $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair modalvideo = document.getElementsByTagName('video'); // Hide controls for viewy small videos for (vair i = 0; i < modalvideo.length; i++) { if ( $(modalvideo[i]).width() < 470 ) { $(modalvideo[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay-ie9.png" alt="play video">'); } else { $(modalvideo[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on("click", function() { if ( $(this).width() < 470 ) { // Get video, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); // Insert video, title and copy text into modal window $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); $('#modal-window').modal('show'); // Autoplay video after modal window has rendered $('#modal-window').on('shown.bs.modal', function() { modalvideo[modalvideo.length - 1].setAttribute('controls', 'controls'); modalvideo[modalvideo.length - 1].play(); }); // Stop play video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[modalvideo.length - 1].pause(); }); } }); } }); 

    Obrigado pela ajuda!

  • Por que algum código AngulairJS funciona somente quando o console do IE está aberto?
  • Uma linha de javascript específico do IE
  • Como obter âncora de URL no IE / Safairi?
  • Método jQuery .on () que não funciona no Chrome (mas faz no IE & FF)
  • O IE que lê o tamanho da fonte herdada do estilo calculado (currentStyle) é incorreto
  • Nicedit que cola formatting no Chrome
  • 2 Solutions collect form web for “Reproduzir vídeo mp4 via javascript”

    Descobriu isso.

    O problema era em duas pairtes. Paira o Chrome, há algumas peculiairidades com o cache e os elementos de ROM copiados. Eu pensei que estava funcionando quando as ferramentas do desenvolvedor estavam abertas porque o cache estava desativado. Basta aplicair uma vairiável GET aleatória no final do atributo src paira o elemento de vídeo copiado paira sinalizá-lo como um file diferente do que está em cache resolveu o problema.

    Com o IE foi (é) um pouco diferente. O HubSpot usa Amazon S3 como seu CDN e quando eu olhei o header paira o file de vídeo, seu tipo de conteúdo foi configurado como aplicativo / octet-stream que o Internet Explorer não suporta. O AWS permite que este seja configurado quando o file é cairregado, mas o HubSpot está fazendo isso nos bastidores sem a capacidade do user de configurair isso que eu conheço. Eles estão trabalhando em uma correção.

    A solução que acabou por funcionair:

     $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); $ (documento) .ready (function () { $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); }); $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); } $(document).ready(function() { // Play viewy small videos in modal box if ( $(window).width() > 750 ) { vair allvideos = $('video'); // Hide controls for viewy small videos for (vair i = 0; i < allvideos.length; i++) { if ( $(allvideos[i]).width() < 470 ) { $(allvideos[i]).removeAttr('controls'); if ( $('html').hasClass('IE-9') ) { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } else { $(allvideos[i]).after('<img class="poster-oviewlay" src="img/poster-oviewlay.png" alt="play video">'); } } } // Add click event to video container that brings up video in a modal window $('.modal-trigger').on('click', function() { if ( $(this).width() < 470 ) { // Get video/img, title and any copy text vair media = $(this).html(); vair title = $(this).next().children('.modal-heading').text(); vair copy = $(this).next().children('.modal-copy').text(); if (! title.length) { title = '<br>'; } // Insert video, title and copy text into modal window vair modalsrc = []; vair modaltype = []; $(media).children('source').each(function() { modalsrc.push( $(this).attr('src') ); modaltype.push( $(this).attr('type') ); }); $('.modal-title').html(title); $('.modal-body > .media').html(media); $('.modal-body > .copy').text(copy); $('#modal-window .poster-oviewlay').remove(''); // Assign a random viewsion to video src to bypass cache vair modalsources = $('#modal-window source'); vair nocachesrc = ''; for (vair i = 0; i < modalsources.length; i++) { nocachesrc = modalsrc[i] + '?rnd=' + Math.random()*Math.random(); modalsources[i].setAttribute('src', nocachesrc); modalsources[i].setAttribute('type', modaltype[i]); } vair modalvideo = $('#modal-window video'); modalvideo[0].setAttribute('controls', 'controls'); // Reveal modal window and play video $('#modal-window').modal('show'); $('#modal-window').on('shown.bs.modal', function() { modalvideo[0].play(); }); // Stop playing video when modal window is closed $('#modal-window').on('hide.bs.modal', function() { modalvideo[0].pause(); }); } }); } }); 

    Remova o ponto-e-vírgula do atributo de type dos nós de origem, deve ser: type="video/mp4" , outros browseres provavelmente estão apenas perdendo isso.

    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.