我正在尝试在 Google Chrome 上制作全屏 Canvas 。
<style>
#canvas:-webkit-full-screen {
height:100%;
width: 100%;
}
</style>
<button onclick="fullScreen()">Full Screen</button>
<canvas id="canvas"></canvas>
<script>
function fullScreen() {
var c = document.getElementById("canvas");
c.webkitRequestFullScreen();
}
</script>
此代码使 Canvas 全屏，但只有高度全屏。
最佳答案
尝试将 CSS 规则 fixed 用于 position 与 canvas 元素:
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
您可能还需要将 html 和 body 的宽度/高度设置为 100%。
如果你想避免缩放，因为这会给你，你需要直接设置 Canvas 元素的宽度和高度(使用 window.innerHeight 和 .innerWidth).
关于css - Chrome 的全屏 Canvas ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18927126/