Question

我正在实施一个使用Videogular播放视频的网站，因为它与网站内的其他AngularJS很好地集成。所需的每个文件都显示在路径中的正确位置，但最终结果只显示总时间，已用时间和已用时间栏。

现在我现在控件就在那里，好像我将鼠标悬停在音量控制应该出现的位置。

我正在使用Chrome版本32.0.1700.107进行测试。我想我跟着演示一直到了这封信。

这就是我引用特定样式表的方式

    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/offcanvas.css">
    <link rel="stylesheet" href="css/videogular/videogular.css">
    <link rel="stylesheet" href="css/app2.css"/>

这就是我拉入js文件的方式。未显示包含jquery，bootstrap和offcanvas js文件。

    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-route.js"></script>
    <script src="lib/angular/angular-sanitize.js"></script>
    <script src="js/videogular/videogular.js" type="text/javascript"></script>
    <script src="js/videogular/plugins/controls.js" type="text/javascript"></script>
    <script src="js/videogular/plugins/overlay-play.js" type="text/javascript"></script>
    <script src="js/videogular/plugins/buffering.js" type="text/javascript"></script>
    <script src="js/videogular/plugins/poster.js" type="text/javascript"></script>
    <script src="js/app.js"></script>
    <script src="js/services.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filters.js"></script>
    <script src="js/directives.js"></script>

我甚至使用与演示相同的配置

  $scope.config = {
    width: 640,
    height: 360,
    autoHide: false,
    autoPlay: true,
    responsive: true,
    theme: {
      url: "css/videogular/videogular.css",
      playIcon: "&#xe000;",
      pauseIcon: "&#xe001;",
      volumeLevel3Icon: "&#xe002;",
      volumeLevel2Icon: "&#xe003;",
      volumeLevel1Icon: "&#xe004;",
      volumeLevel0Icon: "&#xe005;",
      muteIcon: "&#xe006;",
      enterFullScreenIcon: "&#xe007;",
      exitFullScreenIcon: "&#xe008;"
    }

最后我的目录结构如下：

应用
- CSS
- videogular
  - 字体
    - icomoon.eot
    - icomoon.svg
    - icomoon.ttf
    - icomoon.woff
  - videogular.css
- IMG
- JS
  - videogular
  - 插件
    - buffering.js
    - controls.js
    - 叠加play.js
    - poster.js
  - videogular.js
- lib
- 泛音
- 视频
- 的观点
  - videogular
    - 插件
      - 缓冲
        
        buffering.html
      - 控制
        
        controls.html
        
        全屏button.html
        
        静音button.html
        
        播放暂停button.html
        
        体积一个bar.html
      - 覆盖播放
        
        叠加play.html
- 的index.html

现在我确定我错过了一些东西，但我看不到它。有什么帮助吗？

Answer 1

所以我明白了。根据elecash对一切看起来正确的问题的评论我将所有内容与演示进行了比较。事实证明我的错误是从icomoon网站获得icomoon字体，而不是演示。如果没有在icomoon.svg中定义的unicode定义，它就无法知道正确的glyphy，只要它在配置中正确定义就可以显示。快速下载字体文件并重新启动服务器并正确呈现所有内容。

视频控制不完全渲染

1 个答案: