p5.js元素位置

Question

我编码一个p5.js比赛，我不得不得出一个按钮，输入，并通过我的画布的p html元素。我想要所有这些元素相对于画布居中。

我尝试没有成功此解决方案：

var gameCanvas = createCanvas(600, 600); 
gameCanvas.parent("game-container"); 

input = createInput(); 
input.position(280, 300); 
input.parent("game-container"); 

我有游戏cointainer ID的DIV这项工作，直到我通过CSS中心的股利。当我居中div时，画布会居中，但输入位置仍然相对于div而不是画布。

所以这是一个响应式html页面，支持MDL框架。如果我之前和之后我的“游戏容器” DIV中心，“MDL-布局间隔”的div画布，画布留在中心，但输入保持到左（从我的游戏容器div的左侧300像素）。

如果我将游戏容器div与mdl col偏移居中，inout和canvas均居中，但我失去了响应中心。任何与p5.js一样好的人都知道我能如何解决这个问题？

Answer 1

这是因为您正在加载输入对象您加载CSS页面之前。要么把脚本标签的CSS标签后，或将

input = createInput(); 
input.position(280, 300); 
input.parent("game-container"); 

到您的setup()功能。