Javascript 全屏api不适用于IE
我正在尝试在IE中使用全屏API全屏显示内容,一切正常,除了下面的IE是代码,任何帮助都会很好。提前谢谢Javascript 全屏api不适用于IE,javascript,jquery,html,css,internet-explorer,Javascript,Jquery,Html,Css,Internet Explorer,我正在尝试在IE中使用全屏API全屏显示内容,一切正常,除了下面的IE是代码,任何帮助都会很好。提前谢谢 <div> <div id="container" > ..... content goes here </div> <input type="button" id="fsbutton" title="View Full Screen"> </div> JAVASCRIPT代码: (function() {
<div>
<div id="container" >
..... content goes here
</div>
<input type="button" id="fsbutton" title="View Full Screen">
</div>
JAVASCRIPT代码:
(function() {
var
fullScreenApi = {
supportsFullScreen: false,
isFullScreen: function() { return false; },
requestFullScreen: function() {},
cancelFullScreen: function() {},
fullScreenEventName: '',
prefix: ''
},
browserPrefixes = 'webkit moz o ms khtml'.split(' ');
// check for native support
if (typeof document.cancelFullScreen != 'undefined') {
fullScreenApi.supportsFullScreen = true;
} else {
// check for fullscreen support by vendor prefix
for (var i = 0, il = browserPrefixes.length; i < il; i++ ) {
fullScreenApi.prefix = browserPrefixes[i];
if (typeof document[fullScreenApi.prefix + 'CancelFullScreen' ] != 'undefined' ) {
fullScreenApi.supportsFullScreen = true;
break;
}
}
}
// update methods to do something useful
if (fullScreenApi.supportsFullScreen) {
fullScreenApi.fullScreenEventName = fullScreenApi.prefix + 'fullscreenchange';
fullScreenApi.isFullScreen = function() {
switch (this.prefix) {
case '':
return document.fullScreen;
case 'webkit':
return document.webkitIsFullScreen;
default:
return document[this.prefix + 'FullScreen'];
}
}
fullScreenApi.requestFullScreen = function(el) {
return (this.prefix === '') ? el.requestFullScreen() : el[this.prefix + 'RequestFullScreen']();
}
fullScreenApi.cancelFullScreen = function(el) {
return (this.prefix === '') ? document.cancelFullScreen() : document[this.prefix + 'CancelFullScreen']();
}
}
// jQuery plugin
if (typeof jQuery != 'undefined') {
jQuery.fn.requestFullScreen = function() {
return this.each(function() {
var el = jQuery(this);
if (fullScreenApi.supportsFullScreen) {
fullScreenApi.requestFullScreen(el);
}
});
};
}
// export api
window.fullScreenApi = fullScreenApi;
})();
</script>
<script>
var fsButton = document.getElementById('fsbutton');
var fsElement = document.getElementById('container');
if (window.fullScreenApi.supportsFullScreen) {
// handle button click
fsButton.addEventListener('click', function() {
//alert(fsElement);
window.fullScreenApi.requestFullScreen(fsElement);
//alert("hi");
}, true);
fsElement.addEventListener(fullScreenApi.fullScreenEventName, function() {
if (fullScreenApi.isFullScreen()) {
alert("yes");
//fsStatus.innerHTML = 'Whoa, you went fullscreen';
} else {
alert("no");
// fsStatus.innerHTML = 'Back to normal';
}
}, true);
} else {
alert("no");
// fsStatus.innerHTML = 'SORRY: Your browser does not support FullScreen';
}
</script>
<div>
<div id="container" >
..... content goes here
</div>
<input type="button" id="fsbutton" title="View Full Screen">
</div>
(函数(){
变量
fullScreenApi={
supportsFullScreen:错误,
isFullScreen:函数(){return false;},
requestFullScreen:函数(){},
取消全屏:函数(){},
fullScreenEventName:“”,
前缀:“”
},
浏览器前缀='webkit moz o ms khtml'.split('');
//检查本机支持
if(typeof document.cancelFullScreen!=“未定义”){
fullScreenApi.supportsFullScreen=true;
}否则{
//按供应商前缀检查全屏支持
for(var i=0,il=browserPrefixes.length;i
HTML代码:
<div>
<div id="container" >
..... content goes here
</div>
<input type="button" id="fsbutton" title="View Full Screen">
</div>
..... 内容在这里
我没有尝试,但我认为这是因为IE for在取消全屏中的“全屏”
和请求全屏”
,这是实际的btw
<div>
<div id="container" >
..... content goes here
</div>
<input type="button" id="fsbutton" title="View Full Screen">
</div>
其他浏览器这次都错了。IE控制台中有错误吗?哪一行失败了?错误是什么?它没有说什么,没有错误消息这里是ie全屏的链接,但我没有得到它。请提供任何帮助。语法是Element.requestFullscreen()代码>时,代码查找元素。requestFullScreen()代码>注意全屏中的S
,但这只适用于IE11。这是个坏消息@3bu1是的,FullscreenAPI仅在IE11及更高版本中实现(请查看给定文档中的实现表)
<div>
<div id="container" >
..... content goes here
</div>
<input type="button" id="fsbutton" title="View Full Screen">
</div>