Javascript 响应随机生成的元素_Javascript_Html_Random_Responsive Design_Generated

Javascript 响应随机生成的元素

javascript html random responsive-design

Javascript 响应随机生成的元素,javascript,html,random,responsive-design,generated,Javascript,Html,Random,Responsive Design,Generated,我试图制作一个随机生成单词的页面，以响应的方式运行 <head> <style type='text/css'> .box { height: auto; position: absolute; width: auto; } </style> <script type='text/javascript'> function setDivPos() { for (i=1; i<=2; i++) { var x =

我试图制作一个随机生成单词的页面，以响应的方式运行

<head>
<style type='text/css'>

.box {
  height: auto;
  position: absolute;
  width: auto;
 }
</style>
<script type='text/javascript'>
function setDivPos() {
  for (i=1; i<=2; i++) {
     var x = Math.floor(Math.random()*1130);
     var y = Math.floor(Math.random()*722);
     document.getElementById('div'+i).style.left = x + 'px';
     document.getElementById('div'+i).style.top = y + 'px';
  }
</head>

<body onload='setDivPos();'>
<div id='div1' class='box'>ARCHIVE</div>
<div id='div2' class='box'>PERSPECTIVE</div>
</div>
</body>


.盒子{
高度：自动；
位置：绝对位置；
宽度：自动；
}
函数setDivPos（）{
对于（i=1；i所以我认为你们的一切都是对的..似乎你们忘了创建一个div，它用一个相对div环绕着另外两个div。检查这个提琴

.盒子{
高度：自动；
位置：绝对位置；
宽度：自动；
}
函数setDivPos（）{
对于（i=1；i
您需要问一个问题。我希望它现在更具体。您如何调用setDivPos（）？您有两个名为div1和div2的元素吗？非常感谢您两次提供帮助，这是全部代码。您将遇到的问题是，如果您不希望单词重叠，那么您需要跟踪文档中所有先前附加的单词的位置。您确定这是一种有效的方法吗？在小提琴程序中组件做了他们会做的事情，不管容器分区如何。我也在一台屏幕比我大的计算机上做了尝试，它仍然做了使用容器分区之前做的事情。还有，onDomready做了什么？我认为它不起作用，因为它只是把左上角的单词放在一起，但我也有兴趣知道它是什么应该这样做（我想我根据小提琴脚本正确地使用了这两个建议）我在其中添加了额外的div，因为在您的代码中有一个额外的div。至于onDomready，我应该对此更清楚一点。我通常使用JQuery，并会在$（文档）中调用该函数.准备好了。因为我假设我没有能力用提琴抓住尸体。检查一下这个以不同方式使用加载的提琴。老实说，我看不出这和之前的有什么区别。我尝试了你建议的那句话，但结果是完全相同的。好吧，你的问题是你没有关闭脚本标记，你不要在脚本中关闭函数。您有一个没有开始标记的结束div标记。我调整了我的答案，该答案应该满足您的需要。
    <head>
    <style type='text/css'>

.box {
  height: auto;
  position: absolute;
  width: auto;
 }
</style>
<script type='text/javascript'>
function setDivPos() {
  for (i=1; i<=2; i++) {
     var x = Math.floor(Math.random()*1130);
     var y = Math.floor(Math.random()*722);
     document.getElementById('div'+i).style.left = x + 'px';
     document.getElementById('div'+i).style.top = y + 'px';
  }}
 //Add this script ending tag and your closing bracket on the function
</script>
</head>

<body onload='setDivPos();'>
<div id='div1' class='box'>ARCHIVE</div>
<div id='div2' class='box'>PERSPECTIVE</div>
<!-- This is commented out, but you should probably just delete the div -->
<!-- </div> -->
</body>