亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

Three.js實現(xiàn)瀏覽器變動時進行自適應的方法

 更新時間：2017年09月26日 09:48:42   作者：專注前端30年  
這篇文章主要給大家介紹了關于Three.js實現(xiàn)瀏覽器變動時進行自適應的方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友可以參考借鑒，下面隨著小編來一起學習學習吧。

前言

有的時候，我們打開了瀏覽器的頁面，顯示了當前的渲染的模型。但是，如果你沒有設置場景模型跟隨著瀏覽器的寬高度變化進行自適應，就gg了。所以，今天額外補上一篇相關的怎么跟隨瀏覽器變動進行自適應，下面話不多說了，來一起看看詳細的介紹吧。

要是場景隨著瀏覽器的大小變動進行自適應，就需要監(jiān)聽window的resize事件，就是瀏覽器變動事件。

window.onresize = function(){}

或者使用addEventListener事件

window.addEventListener("resize",function(){})

事件監(jiān)聽成功了以后，就需要寫變動后需要觸發(fā)的表達式了：

//窗口變動觸發(fā)的函數(shù) 
function onWindowResize() { 
 
 camera.aspect = window.innerWidth / window.innerHeight; 
 camera.updateProjectionMatrix(); 
 renderer.setSize( window.innerWidth, window.innerHeight ); 
 
}

上面主要就是更新了照相機的比例和渲染器的比例，就達到了當前的效果。

代碼使用的上一節(jié)的，就不上傳代碼了（需要的朋友點擊這里），上傳兩張示例效果。


上面就是全屏狀態(tài)下顯示的效果，下面是直接將瀏覽器改成了一半的效果：


總結

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家學習或者使用Three.js具有一定的參考學習價值，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。

相關文章

最新評論