我有一个scorm模块,它在一个新窗口中启动,在我的js文件中的window.open中resizable = 1:
function OpenScormModuleWindow(scormModuleId, scormModuleUrl, title, width, height)
{
_scormModuleId = scormModuleId;
InitializeUserScormModule();
scormModuleWindow = window.open(scormModuleUrl, "title", "width=" + width + ", height=" + height + ", resizable = 1");
scormModuleWindow.focus();
}
在我看来,我有:
var myWidth = 0, myHeight = 0;
if (typeof (window.innerWidth) == 'number')
{
myWidth = window.innerWidth;
myHeight = window.innerHeight;
}
else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight))
{
myWidth = document.documentElement.clientWidth; myHeight = document.documentElement.clientHeight;
}
else if (document.body && (document.body.clientWidth || document.body.clientHeight))
{
myWidth = document.body.clientWidth; myHeight = document.body.clientHeight;
}
我得到身高和宽度但不正确
用户现在可以调整大小,当窗口尺寸正确时,我该如何获得高度和宽度?
我需要获取这些值,以便保存,下次窗口打开时,它的大小正确。
感谢
答案 0 :(得分:9)
使用侦听调整大小的事件侦听器,然后您可以重置您的值:
window.addEventListener('resize', setWindowSize);
function setWindowSize() {
if (typeof (window.innerWidth) == 'number') {
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else {
if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else {
if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
}
}
}
如果您需要跨浏览器解决方案,请使用jQuery($.on('resize', func)
)或查看JavaScript window resize event
答案 1 :(得分:3)
希望此示例对您有帮助...
HTML代码:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Window Size : height and width</title>
</head>
<!-- Resize the window (here output panel) and see the result !-->
<body onload="getSize()" onresize="getSize()">
<div id="wh">
<!-- Place height and width size here! -->
</div>
<body>
</body>
</html>
JavaScript代码:
function getSize()
{
var w = document.documentElement.clientWidth;
var h = document.documentElement.clientHeight;
// put the result into a h1 tag
document.getElementById('wh').innerHTML = "<h1>Width: " + w + " Height: " + h + "</h1>";
}
或者您也可以使用Jquery代码调整大小:
var height = $(window).height();
var width = $(window).width();
$(window).resize(function() {
var height = $(window).height();
var width = $(window).width();
console.log("height"+height);
console.log("width"+width);
});
答案 2 :(得分:0)
就我所见,这是最好的方法;
function resizeCanvas() {
canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
WIDTH = canvas.width;
HEIGHT = canvas.height;
}