我尝试使用此代码全屏打开 html 页面。但我想在没有 iframe 的情况下全屏打开另一个页面。（即，如果我点击按钮，浏览器会进入全屏并在同一窗口中打开 www.google.com。）
这是我的代码
<html>
<head>
<meta charset="UTF-8" />
<title>jQuery Fullscreen Plugin demo</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="../jquery.fullscreen-min.js"></script>
<style>
width:90%;
height:90%;
</style>
<style>
#form
{
width:100%;
height:100%
}
</style>
<script>
function redirect()
{
$('#form').bind('click', function() {
var $this = $(this);
var outputHolder = $("<div id='.uimodal-output'></div>");
$("body").append(outputHolder);
outputHolder.load($this.attr("href"), null, function() {
outputHolder.dialog(// whatever params you want);
});
return false;
});
}
</script>
</head>
<body style="background:white">
<h1>jQuery Fullscreen Plugin demo</h1>
<div id="form" style="display: none;">
<h1>blah blah blah</h1>
</div>
<div id="buttons">
<button onclick="func1();">Enter Fullscreen mode (Form)
</button>
</div>
<script>
function func1(){
$('#form').fullScreen(true)
var url = "http://www.google.com";
// $(location).attr('href',url);
show();
function show() {
if(document.getElementById('form').style.display=='none') {
document.getElementById('form').style.display='block';
}
}
}
</script>
<script type="text/javascript">
$(function() {
$(".fullscreen-supported").toggle($(document).fullScreen() != null);
$(".fullscreen-not-supported").toggle($(document).fullScreen() == null);
$(document).bind("fullscreenchange", function(e) {
if ($(document).fullScreen())
{
document.getElementById('form').style.display='block';
}
else
{
document.getElementById('form').style.display='none';
}
});
});
</script>
</body>
</html>