基本的なJavaScript：ランダムな配置

Question

私は300x300px空間内のランダムな場所に表示される正方形を作成しようとしています。現在、水平方向に移動していますが、垂直方向に移動していません。誰かがそれを垂直に動かせるように助けることができますか？ありがとうございました！あなたはそれが良いことがありdisplay: noneを削除する場合は、thisで

 #square {width: 200px; 
     height: 200px; 
     display: none; 
     position: relative; 
     } 

     var top=Math.random(); 
       top=top*300;     
     var left=Math.random(); 
       left=left*300;      
     document.getElementById("square").style.top=top+"px";     
     document.getElementById("square").style.left=left+"px";  

Answer 1

使用left：

また、あなたはこれを簡素化することができます。私にとって

const getRandom = (min, max) => Math.floor(Math.random()*(max-min+1)+min); 
 

 
const square= document.querySelector('#square'); 
 
setInterval(() => { 
 
    square.style.left= getRandom(0, 300 - 200)+'px'; // Horizontally 
 
    square.style.top = getRandom(0, 300 - 200)+'px'; // Vertically 
 
    
 
}, 500); // every 1/2 second

#space { 
 
    width: 300px; 
 
    height: 300px; 
 
    background-color: #eee 
 
} 
 
#square { 
 

 
width: 200px; 
 
height:200px; 
 
position: relative; 
 
background-color: #8e4435 
 
}

<div id="space"> 
 
    <div id="square"> 
 

 
    </div> 
 

 
</div>

Answer 2

を比較します。垂直のために水平方向とtop翻訳し

var top = Math.random() * 300;