1

我已经尽我所能在 Blackboard 中将视频全屏显示,但没有任何效果。这仅在加载 video.js 脚本时才会出现问题。如果使用通用的 HTML5 视频,它将起作用。我的错误:未捕获的 TypeError:无法调用未定义的方法“webkitEnterFullScreen”

堆栈跟踪(我也在使用 video-js 标记插件):

vent.returnValue is deprecated. Please use the standard event.preventDefault() instead.
[videojs-markers] Initialize videojs.markers.js:113
[videojs-markers] creating markers videojs.markers.js:44
[videojs-markers] markers videojs.markers.js:115
Array[8]
0: Object
1: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
length: 8
__proto__: Array[0]
 videojs.markers.js:116
[videojs-markers] creating marker tip videojs.markers.js:61
Uncaught TypeError: Cannot call method 'webkitEnterFullScreen' of undefined L1P04.PracticesProcedures.html:188
'KeyboardEvent.keyLocation'' is deprecated. Please use 'KeyboardEvent.location' instead.

编码:

<video id="dd_movie" class="video-js vjs-default-skin " controls width="640" height="480" poster="../../../../Media/Videos/U07L1P04_PracticeAndProcedures.jpg" preload="auto" data-setup="{}" allowFullScreen>    
                <source src="../../../../Media/Videos/U07L1P04_PracticeAndProcedures.mp4" type='video/mp4'>
                <source src="../../../../Media/Videos/U07L1P04_PracticeAndProcedures.webm" type='video/webm'>
                <source src="../../../../Media/Videos/U07L1P04_PracticeAndProcedures.ogv" type="video/ogv">
                <track kind="captions" src="../../../../Media/Videos/U07L1P04_PracticeAndProcedures.vtt" srclang="en" label="English" />
            </video>

库加载(就在 之前</html>):

<script src="../../../js/libs/video-js/video.js"></script>

  <script>
    videojs.options.flash.swf = "../../../js/libs/video-js/video-js.swf";
  </script>
  <!-- end: video -->



    <!-- begin: video-js markers plugin -->
    <script src="../../../js/libs/video-js/markers/videojs.markers.js"></script>

  <script>
     // initialize video.js
     var video = videojs('dd_movie');

     //load the marker plugin
     video.markers({
        setting: {
           markerTip:{
              default_text: ""
           },
           breakOverlay:{
              display: false
           }
        },
        //set break time
        marker_breaks:[8.5, 47, 66, 88, 112, 138, 183,204],
        marker_text:["Open Files","Image Properties","Zoom Level","Navigation Tools","Copy & Paste","Layers","Save Files","Quit GIMP"]
     });


  $(window).load(function(){
    $('.vjs-fullscreen-control').on('click',function(){
        $(".dd_movie")[0].webkitEnterFullScreen();
        console.log('okay...'); 
    });
});
  </script>  

注意:如果我在本地或单独的页面上打开页面,它可以 100% 工作。我猜这是 DOM 问题或对 Blackboards 库的干扰。有没有办法用我自己的覆盖黑板库?

对于那些不知道的人,Blackboard 通过 iFrame 加载页面,这是我假设的问题的一部分。同样,这在其自己的页面上 100% 有效,而不是在 Blackboard 上。

4

1 回答 1

0

只有当您使用 Blackboard API 将内容/服务开发为构建块或 Web 服务时,您才能完成这项工作。我认为没有办法在不使用 Blackboard 库的情况下在 Blackboard 中呈现任何内容。一种方法是创建一个混搭工具,它可以让您轻松播放视频并最大化播放器。我已经看到 Sharestream 的人创建了这样一个视频播放器工具,它可以很好地在窗口或全屏模式下工作。

于 2014-08-20T11:07:04.383 回答