如何更改dat.gui下拉菜單的位置？

我使用的是dat.gui，我想將它放在與右上角不同的地方，最好在頂部重疊一個three.js畫布，這是通過命令完成的，還是有一些CSS可以做到這一點？如何更改dat.gui下拉菜單的位置？

2014-09-03 rich green

你需要一些JavaScript和CSS才能做到這一點。

GUI構造函數可以傳遞一個參數對象。您可以告訴控件不要自動放置。您還可以將一個元素ID，使造型更容易

var gui = new dat.GUI({ autoPlace: false }); 
gui.domElement.id = 'gui';

然後是CSS的地方也可以是這樣的：

#gui { position: absolute; top: 2px; left: 2px }

來源

2014-09-08 00:36:31 satori

TY，它不工作時，我autoPlace：false，但是當我改變eid並添加CSS到該ID它很好。你知道是否有辦法阻止它偶爾滾動屏幕？不管用戶在網頁上的哪個位置，都可以避免被人看到。 – 2014-09-08 15:47:08

只是將下面的代碼添加到您的風格：\t \t – mbehnaam 2016-05-24 01:48:36

接受的答案回答我的問題，但不完全是我爲了解決這個問題，當我在頁面上下下去的時候，一直在跟着我滾動。我沒有爲主題元素設置ID，而是將該元素附加到現有元素，我可以更好地控制它。

CSS：

.moveGUI{ 
    position: absolute; 
    top: 13.1em; 
    right: -1em; 
}

JS：

// Create GUI 
    gui = new dat.GUI({ autoPlace: false }); 
    { 
     // create fill and open folders 
    } 
    var customContainer = $('.moveGUI').append($(gui.domElement));

HTML：

<div class = 'moveGUI'> 
</div>

來源

2014-09-09 14:52:19

覆蓋CSS：

.dg.a { margin-right:60px !important; }

來源

2016-04-29 11:16:59

如何更改dat.gui下拉菜單的位置？

回答

相關問題