1

我正在实现一个使用 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
    • 视频
      • 字体
        • icomoon.eot
        • icomoon.svg
        • icomoon.ttf
        • icomoon.woff
      • videogular.css
    • 图像
    • js
      • 视频
      • 插件
        • 缓冲.js
        • 控件.js
        • 覆盖播放.js
        • 海报.js
      • videogular.js
    • 部分
    • 视频
    • 意见
      • 视频
        • 插件
          • 缓冲
            • 缓冲.html
          • 控制
            • 控件.html
            • 全屏按钮.html
            • 静音按钮.html
            • 播放暂停button.html
            • 音量bar.html
          • 重叠播放
            • 覆盖播放.html
    • 索引.html

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

4

1 回答 1

2

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

于 2014-03-03T16:39:55.803 回答