微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

HTML5 Canvas适合窗口

当我这样做时,我正试图让我的画布适合页面
ctx.canvas.width = window.innerWidth;
ctx.canvas.height = window.innerHeight;

它只是水平和垂直,这是添加滚动条.
它过去的大小是关于滚动条的大小在它们偶然存在之前被考虑(只是一个猜测)这是什么发生的,我将如何让它适合没有滚动条的页面.

解决方法

将画布位置设置为绝对值.还要确保在包含元素中没有设置填充或边距.

这就是我在所有全屏幕画布演示中使用的内容.

body,html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
canvas {
    position:absolute;
}

Full Screen Demo

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。