Question

我正在尝试创建一个随机生成单词的页面，以响应方式运行。

<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>

整个网站几乎都基于此算法。如何在区域1130x722内制作这些随机定位的对象，放在每个用户的屏幕大小内。（响应）

Answer 1

所以我认为你拥有关于正确的一切......看来你忘了用另一个div来创建包围其他两个div的div。检查这个小提琴Example with a button

    <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>

响应随机生成的元素

1 个答案: