Question

我将这些视频加载到bootstrap模式上。如果您单击主页面中的一个车辆（下面的链接），则会打开视频。问题出在视频之间。如果单击页面底部的“下一步”，您（通常）会在视频之间获得白色闪烁。我尝试了几乎所有的黑色背景，z-index但没有。

这是控制模态

中“玩家”的jQuery代码段

jQuery('.startstop').on('shown.bs.modal', function () {
      var $video = jQuery('video', jQuery(this));
    $video[0].play();
});


jQuery('.startstop').on('hide.bs.modal', function () {
    var $video = jQuery('video', jQuery(this));
        $video[0].pause();
        $video[0].currentTime = 0;
});


jQuery(document).ready(function(){

var timer;

jQuery(window).on('mousemove', function () {
  jQuery('.modnavi-left, .modnavi, .mbutton').addClass('show');
  try {
  clearTimeout(timer);
  } catch (e) {}
timer = setTimeout(function () {
  jQuery('.modnavi-left, .modnavi, .mbutton').removeClass('show');
  }, 3000);
});


// CARS //

jQuery('#end').on('ended',function(){
  jQuery('#THECHALLENGE').modal('hide');
  jQuery('#HONDAMODE').modal('show');
});

jQuery(".next1").click(function() {
 jQuery('#THECHALLENGE').modal('hide');
});  

// ----_______

这是其中一种模式：

<div id="THECHALLENGE" class="modal startstop" tabindex="-1" role="dialog">
 <div class="modal-dialog modal-lg" role="document">    
  <div class="modal-content">      
  <button type="button" class="btn btn-primary mbutton" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">X</span></button>
  <video id="end" poster="http://www.andreasgrassl.de/cdn/poster/andreas-grassl-director.gif" controls width="1280" height="720" preload="none">
    <source src="http://andreasgrassl.de/cdn/BMW_M4%20GTS_The%20Challenge.mp4" type="video/mp4">
    Your browser does not support the video tag.
  </video>
  <h4 class="modal-title">BMW – THE CHALLENGE <a class="next1 align-right modnavi" data-toggle="modal" href="#HONDAMODE">next</a></h4> 

  </div>
 </div>
</div>

这是触发器之一

<div class="col-sm-4 col-lg-2 col-xs-12">
  [caption id="attachment_23" class="zoomag" align="alignnone" width="500"]<a data-toggle="modal" href="#THECHALLENGE"><img src="http://grassl.lopezi.biz/wp-content/uploads/2016/07/1_BMW_M4_GTS_The-Challenge_.jpg" alt="BMW - THE CHALLENGE" width="500" height="281" class="size-full wp-image-23" /></a> BMW - THE CHALLENGE[/caption]
</div>

website

视频之间的白色闪烁

0 个答案: