Threejs入门进阶实战案例(4):addEventListener() 方法自适应窗口显示的方案

简介: Threejs入门进阶实战案例(4):addEventListener() 方法自适应窗口显示的方案

addEventListener() 方法调整照相机和渲染器尺寸。

    /* 窗口变动触发 */
    function onWindowResize() {
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
        renderer.setSize(window.innerWidth, window.innerHeight);
    }
    /* 监听事件,自适应窗口 */
    window.addEventListener('resize', onWindowResize(), true);


Done!

目录
打赏
0
0
0
0
184
分享
相关文章
如何实现两栏布局?这篇文章告诉你所有的细节!
欢迎来到前端入门之旅!这个专栏是为那些对Web开发感兴趣、刚刚开始学习前端的读者们打造的。无论你是初学者还是有一些基础的开发者,我们都会在这里为你提供一个系统而又亲切的学习平台。我们以问答形式更新,为大家呈现精选的前端知识点和最佳实践。通过深入浅出的解释概念,并提供实际案例和练习,让你逐步建立起一个扎实的基础。无论是HTML、CSS、JavaScript还是最新的前端框架和工具,我们都将为你提供丰富的内容和实用技巧,帮助你更好地理解并运用前端开发中的各种技术。
three.js入门第一个案例
three.js入门第一个案例
【零基础入门前端系列】—浏览器内核、背景渐变、转换(二十二)
【零基础入门前端系列】—浏览器内核、背景渐变、转换(二十二)
wepy框架-触摸内容滑动组件使用步骤
wepy框架-触摸内容滑动组件使用步骤
66 0
Threejs入门进阶实战案例(2):正常静态渲染和渲染动画的解决方案
Threejs入门进阶实战案例(2):正常静态渲染和渲染动画的解决方案
157 0
Echarts实战案例代码(45):拼接屏字体自适应的解决方案
Echarts实战案例代码(45):拼接屏字体自适应的解决方案
90 0
前端知识案例学习9-可调整尺寸得UI
前端知识案例学习9-可调整尺寸得UI
204 0
前端知识案例学习9-可调整尺寸得UI
An动画基础之按钮动画与基础代码相结合
An动画基础之按钮动画与基础代码相结合
874 0

热门文章

最新文章

下一篇
oss创建bucket
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等