我正在使用常用控件在播放/暂停,曲目,音量和全屏控制的网页上播放HTML5视频。这些视频是mp4 / ogg格式。我的用户群中有80%使用Internet Explorer 11(由谷歌分析提供)和剩余的 - Mozilla Firefox,Chrome和Safari。问题是 - 除了全屏控制之外的所有控件都不会出现在IE11上。在所有其他浏览器上都像魅力一样。
caniuse [dot] com /#feat = fullscreen建议IE11具有原生全屏支持。
以下是一个例子:
this页面上的嵌入视频允许全屏显示按钮。
在元素上使用与“controls”属性相同的代码不会在IE11上显示全屏选项。
小提琴:http://jsfiddle.net/jaisfiddles/f1apusx3/
<video controls>
<source src=http://techslides.com/demos/sample-videos/small.webm type=video/webm>
<source src=http://techslides.com/demos/sample-videos/small.ogv type=video/ogg>
<source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4>
<source src=http://techslides.com/demos/sample-videos/small.3gp type=video/3gp>
</video>
我错过了什么?我的印象是IE11启用了msRequestFullscreen()api代码。
答案 0 :(得分:3)
我似乎自己偶然发现了解决方案。
我的video
元素包含在iFrame
中。为了使全屏选项可用,我有了指定
<iframe allowfullscreen="true">
对于其他主流浏览器,如Mozilla Firefox,Chrome等,这不是必需的。
请参阅http://caniuse.com/#feat=fullscreen
上的已知问题“从iframe打开时,IE 11无法正常支持全屏。”
答案 1 :(得分:0)
我在某些网站上看到IE11不支持全屏!!! 直到版本11,它才会支持全屏api。 即使是IE10也没有全屏API! 因为它们是原生的控制; 他们不使用全屏API。
答案 2 :(得分:0)
让我们通过创建一个redirect.html as从chrome打开
http://~~/redirect.html?redirectUrl=<your adress>
redirect.html>>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="tr">
<head>
<title>Please wait..Lütfen Bekleyiniz...</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
function openURL() {
debugger;
var url = getParameterByName("redirectUrl");
if (!url)
return;
if (msieversion()) {
var shell = new ActiveXObject("WScript.Shell");
shell.run("Chrome " + url);
window.open('', '_self', '');
window.close();
}
else {
window.location.href = url;
}
}
function msieversion() {
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number
{
return true;
}
return false;
}
function getParameterByName(name, url) {
debugger;
if (!url) url = window.location.href;
// name = name.replace(/[\[\]]/g, "\\$&");
// var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?]" + name + "(=([^]*)||$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
</script>
</head>
<body onload="openURL()">
</body>
</html>