canvas.height vs screen.availHeight显示不同的值

Question

我有canvas.height和screen.availHeight报告不同的值。 这是我的代码：

canvas.height = document.height || document.body.clientHeight;
canvas.width  = document.width  || document.body.clientWidth;

当我查询时：

alert("canvas.width = " + canvas.width + 
"/n canvas.height = " + canvas.height + 
"/n screen.availHeight = " + screen.availHeight);

我明白了：

canvas.width       = 1904 which seems correct;
canvas.height      = 191  which is way out of order;
screen.availHeight = 1040 which seems correct.

我错过了什么或者有什么不对吗？

Answer 1

这里

canvas.height = document.height || document.body.clientHeight;
canvas.width  = document.width  || document.body.clientWidth;

您在浏览器尺寸http://www.w3schools.com/js/js_window.asp

中设置文档

以防

screen.availHeight 

availHeight属性返回用户屏幕的高度（以像素为单位），减去Windows任务栏等界面功能。

http://www.w3schools.com/jsref/prop_screen_availheight.asp

您可以使用Math.max(window.innerHeight, document.body.clientHeight)