当前位置: 首页 > news >正文

UnityWebGL 设置全屏

这是Unity导出Web默认打开的页面尺寸

修改后效果


修改 index.html 文件

1.div元素的id属性值为"unity-container",宽度和高度都设置为100%,意味着该div元素将占据整个父容器的空间。canvas元素的id属性值为"unity-canvas",宽度和高度都设置为auto,意味着该canvas元素将自适应父容器的大小。

修改如下所示: 

<div id="unity-container" style="width: 100%;height:100%"><canvas id="unity-canvas" width=auto height=auto></canvas>

2.将非移动端设备,canvas元素的宽度和高度会设置为100%。

修改如下所示:

  if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {var meta = document.createElement('meta');meta.name = 'viewport';meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';document.getElementsByTagName('head')[0].appendChild(meta);container.className = "unity-mobile";canvas.style.width = window.innerWidth + 'px';canvas.style.height = window.innerHeight + 'px';unityShowBanner('暂不支持移动端...');} else {canvas.style.width = "100%";canvas.style.height = "100%";}

修改style.css 

1.设置HTML和BODY元素的宽度和高度为100%,并取消它们的margin和padding。此外,还将overflow属性设置为hidden,以防止内容溢出。

修改如下所示:

html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden;}
.webgl-content{width: 100%; height: 100%;}
.unityContainer{width: 100%; height: 100%;}

相关文章:

  • 设计模式复习
  • Java架构师之路四、分布式系统:分布式架构、分布式数据存储、分布式事务、分布式锁、分布式缓存、分布式消息中间件、分布式存储等。
  • WooCommerce商品采集与发布插件
  • 缩小ppt文件大小的办法
  • C#_各式各样的参数(引用参数、输出参数、数组参数、具名参数、可选参数)
  • (提供数据集下载)基于大语言模型LangChain与ChatGLM3-6B本地知识库调优:数据集优化、参数调整、Prompt提示词优化实战
  • 航空领域中气象常识笔记
  • 什么是跨模态
  • HTML和CSS是前端开发中最基础的两个技术[入门级]
  • 游戏平台如何定制开发?
  • Spring之AOP源码解析(上)
  • 鸿蒙原生应用元服务实战-发布时多设备选择注意事项
  • 9、内网安全-横向移动Exchange服务有账户CVE漏洞无账户口令爆破
  • MacBook的nginx出现13: Permission denied 的问题分析和解决办法
  • 蓝桥杯备赛系列——倒计时50天!
  • @jsonView过滤属性
  • [译] React v16.8: 含有Hooks的版本
  • CSS进阶篇--用CSS开启硬件加速来提高网站性能
  • extract-text-webpack-plugin用法
  • GraphQL学习过程应该是这样的
  • HTML-表单
  • Java Agent 学习笔记
  • Markdown 语法简单说明
  • Shell编程
  • Vim Clutch | 面向脚踏板编程……
  • 线上 python http server profile 实践
  • 新版博客前端前瞻
  • JavaScript 新语法详解:Class 的私有属性与私有方法 ...
  • 基于django的视频点播网站开发-step3-注册登录功能 ...
  • 树莓派用上kodexplorer也能玩成私有网盘
  • ​DB-Engines 12月数据库排名: PostgreSQL有望获得「2020年度数据库」荣誉?
  • ​queue --- 一个同步的队列类​
  • #FPGA(基础知识)
  • #宝哥教你#查看jquery绑定的事件函数
  • (2/2) 为了理解 UWP 的启动流程,我从零开始创建了一个 UWP 程序
  • (Redis使用系列) Springboot 使用redis的List数据结构实现简单的排队功能场景 九
  • (八)Spring源码解析:Spring MVC
  • (收藏)Git和Repo扫盲——如何取得Android源代码
  • (未解决)macOS matplotlib 中文是方框
  • (一)appium-desktop定位元素原理
  • .net MySql
  • .net 调用php,php 调用.net com组件 --
  • .NET/C# 推荐一个我设计的缓存类型(适合缓存反射等耗性能的操作,附用法)
  • .Net高阶异常处理第二篇~~ dump进阶之MiniDumpWriter
  • .net项目IIS、VS 附加进程调试
  • .Net转Java自学之路—SpringMVC框架篇六(异常处理)
  • @cacheable 是否缓存成功_Spring Cache缓存注解
  • @converter 只能用mysql吗_python-MySQLConverter对象没有mysql-connector属性’...
  • [202209]mysql8.0 双主集群搭建 亲测可用
  • [ai笔记9] openAI Sora技术文档引用文献汇总
  • [Angular] 笔记 20:NgContent
  • [BUUCTF 2018]Online Tool
  • [cocos2d-x]关于CC_CALLBACK
  • [DAX] MAX函数 | MAXX函数
  • [ERROR] Plugin 'InnoDB' init function returned error