如果鼠標在瀏覽器外面，Three.js平面被隱藏

我是新來的three.js，我做了一個簡介，但是我有一個奇怪的問題。當鼠標在內容之外時（例如，我重新加載頁面，並且光標位於瀏覽器的重新加載按鈕上或瀏覽器之外）時，該對象不可見。任何人都可以提出什麼問題。如果鼠標在瀏覽器外面，Three.js平面被隱藏

來源

2015-12-24 Denis

請在jsfiddle中發佈您的代碼，以便我們可以幫助您找到問題。 –

@NickDeBeer這裏是hsiddle文件。 https://jsfiddle.net/L6c8dhxd/ thnx無論如何 – Denis

我已經在這裏更新了你的jsfiddle：https://jsfiddle.net/L6c8dhxd/2/它使用cdn中的最新three.js和stats.js庫。我沒有看到你遇到的問題。請詳細說明您是否看到此處的錯誤。 –

問題是mouseX和mouseY在運行render()時未定義。你綁定旋轉鼠標，但是因爲你沒有進入屏幕，mouseX和mouseY仍然是未定義的。

function render() { 
    .... 

    mesh4.rotation.x = mouseY; //undefined here 
    mesh4.rotation.y = mouseX; //undefined here 

    ... 
}

，只有在onDocumentMouseMove()你給mouseX和mouseY的值

function onDocumentMouseMove(event) { 
    var windowHalfX = window.innerWidth/2; 
    var windowHalfY = window.innerHeight; 
    mouseX = (event.clientX - windowHalfX)/11000; // <-- gets a value here 
    mouseY = (event.clientY - windowHalfY)/11000; // <-- and here 
}

的解決方案是兩個變量設置爲上的init（），所以他們不未定義運行render（）函數時。

function init() { 
    mouseX = 0; 
    mouseY = 0; 

    ... 
}

繼承人的jsfiddle：https://jsfiddle.net/L6c8dhxd/3/

我希望這有助於。

來源

2015-12-24 12:46:12

謝謝你，它工作。而不是在init（）上設置mouseX和mouseY，我把全局聲明爲0。我是新的，我有很多工作要做，以良好的方式進行組織。再次感謝你。 – Denis

如果鼠標在瀏覽器外面，Three.js平面被隱藏

回答

相關問題