- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 Ionic
开发一个应用程序,我允许用户上传视频。因此,为了播放视频,我集成了 Video.js
库。
但是,当我尝试全屏播放视频时,我遇到了闪烁问题,即当我点击/单击全屏按钮时,它会全屏播放大约 100 毫秒,然后返回正常屏幕。
Video.html
<ion-view view-title="Video">
<ion-content class="padding">
<input type="file" name="file" accept="video/*;capture=camera" tg-file-select id="fileSelect">
<h3>Upload Video</h3>
<video class="video-js vjs-default-skin vjs-big-play-centered" width="640" height="240" videojs></video>
<div class="row">
<button type="button" class="button button-assertive" ng-click="uploadVideo()" style="margin: auto;">Upload Video</button>
</div>
</ion-content>
</ion-view>
Videojs 指令
(function() {
'use strict';
angular.module('starter')
.directive('videojs', function($sce) {
var linker = function(scope, element, attrs) {
var player;
attrs.type = attrs.type || "video/mp4";
var setup = {
'techOrder': ['html5', 'flash'],
'controls': true,
'preload': 'auto',
'autoplay': false,
'fluid': true
};
attrs.id = "aboutmeVideo";
element.attr('id', attrs.id);
player = videojs(attrs.id, setup, function() {
var source = { type: "video/mp4", src: $sce.trustAsResourceUrl("someFileURL") };
this.src({ type: attrs.type, src: source.src });
});
$('button.vjs-fullscreen-control').on('click', function(e) {
e.preventDefault();
console.log('FullScreen Clicked');
player = videojs('aboutmeVideo');
if (player.isFullscreen()) {
player.exitFullscreen();
} else {
player.requestFullscreen();
}
});
scope.$on('NEW_VIDEO', function(event, videoURL) {
videojs('aboutmeVideo').src({ type: 'video/mp4', src: videoURL });
});
};
return {
restrict: 'A',
link: linker
};
});
})();
那么我应该怎么做才能解决这个闪烁的问题呢?
最佳答案
试试这个,希望对你有帮助。 player.requestFullscreen();
关于javascript - 视频.js : Unable to view fullscreen video,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37129107/
这个问题在这里已经有了答案: android studio adb Syntax error: ")" unexpected (4 个答案) 关闭 5 年前。 我确实将我的工作室更新到 Linux
当我打开 Android Studio 时,它会显示下面的对话框,我的应用程序无法以 Debug模式运行。 最佳答案 找到sdk->platform-tool文件夹,然后运行命令adb tcpip 5
我在 Fedora 33 机器上使用了 VSCode (1.52.1) 一段时间。 我正在使用 Docker 扩展 (v1.9.0) 但由于某种原因,在过去几天中,当我尝试将 VSCode 附加到 D
我正在尝试为我的任务加载一个名为“tr_model.h5”的预训练模型,但出现以下错误: Traceback (most recent call last): File "Trigger_Proje
我最近在 Google Play 中发布了一个 Android 应用程序,到目前为止一切看起来都很棒,但有一个异常(exception)(见下文),我有时会收到控制台崩溃的消息,它只发生在某些用户身上
单击警告时,我收到此消息。这是案件的截图。 错误写道, Unable to open 'warning.cpp': Unable to read file '/Users/dimen/code/C++
重新编译 php 后,当我使用 php cli 时出现以下错误: PHP Warning: PHP Startup: imap: Unable to initialize module Module
使用 git 1.6.4.2,当我尝试 git pull 时出现此错误: error: unable to resolve reference refs/remotes/origin/LT558-op
我是 Kotlin 的新手,我正在学习教程。运行我的应用程序会导致它在运行时崩溃。我在底部导航栏应用程序中有三个 fragment 和一个主要 Activity 。我的目标实际上只是成功运行该应用程序
我在 Windows 10 64 位上运行 Android Studio。我在 5 月 20 日早上升级到了最新的版本和 SDK,从那时起,我在打开 Android Studio 时收到上述错误。我还
因此,我创建了一个 GitHub 操作,该操作应该在发生推送时构建 docker 镜像并将其推送到 docker hub。所以这是我的 GitHub 操作:(第一次创建 GitHub 操作) name
当这些问题中的任何一个都没有帮助我时,这意味着我需要删除并重新安装 Android Studio。 这是错误: Error initializing ADB: Unable to create Deb
Iam running the latest OSX/Flutter/XCode Versions using flutter, android studio and firebase and
我最近重新安装了 ubuntu 20.04.3,在做了一些设置后,我现在在运行 apt update 时总是收到以下错误.我一定是不小心删除了某种缓存文件或目录,但我不知道如何诊断或解决这个问题。 任
今天,当我将更改推送到 Gitlab 中的代码存储库时,我才开始在 Gitlab 中收到此错误消息。 Gitlab fatal: unable to access '.......' SSL Cert
我正在使用 Protractor 和 Jasmine 。 我已经确定了 chrome 驱动程序版本:2.32.498550 (latest)与 Chrome 测试版不兼容 (Version 62.0.
我正在尝试使用 terraform (0.12.24) 和多个 Docker 提供程序(插件版本 2.7.0)执行简单部署。我使用下面的 Terraform 模板的目的是将两个不同的容器部署到两个不同
这个问题我看了很久,最后决定在这里提出来。我需要维护一些用 Delphi 2007 for .NET (ASP.NET 2.0) 编写的应用程序。通常,第一次运行应用程序(使用 IIS)时,我会收到经
如何修复 - 无法创建调试桥:无法启动 adb 服务器:无法检测 adb 版本,adb 输出:/home/dilip/Downloads/sdk/platform-tools/adb: 1:/home
通过命令提示符连接到 android 中的 Sqlite DB 时出现错误。 以下是我遵循的步骤: 我已经在 android 中通过 java 程序创建了 Sqlite 数据库。创建表并向其中插入数据
我是一名优秀的程序员,十分优秀!