i'm trying to move the ball to right but i got this error : Cannot set properties of undefined (setting 'left') i tried to search but all the answers says that my code is correct
var ballSpeed = 3;
var ballPosition = 0;
var ballTime = 1;
var ball = $('#ball');
function bT() {
ballPosition = ballPosition + ballSpeed;
ball.style.left = ballPosition + "px";
}
var ii =setInterval(bT, 1);
console.log(ii);.window{
background-color: #00FFDD;
height:100vh;
margin: 0px;
}
#ball{
position: absolute;
height: 100px;
width: 100px;
border-radius: 50%;
background-color: red;
}<!DOCTYPE html>
<body>
<div class="window">
<div id="ball"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="index.js" charset="utf-8"></script>
</body>
</html>Use this instead:
var ballSpeed = 3;
var ballPosition = 0;
var ballTime = 1;
var ball = $('#ball');
function bT() {
ballPosition = ballPosition + ballSpeed;
ball.css('left', ballPosition);
}
var ii =setInterval(bT, 1);
console.log(ii);.window{
background-color: #00FFDD;
height:100vh;
margin: 0px;
}
#ball{
position: absolute;
height: 100px;
width: 100px;
border-radius: 50%;
background-color: red;
}<!DOCTYPE html>
<body>
<div class="window">
<div id="ball"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="index.js" charset="utf-8"></script>
</body>
</html>.css() method, as outlined here.