Помогите с кодом js плиз

div должен двигаться вправо за счет setInterval каждые 1000 мс. Я в css задал свойство left равное 593px, но когда я перехожу в js оно становится равно 0 и при выполнении функции она улетает на -150x Почему????

123456789101112131415161718

 <div id="sky"></div> 
<style type="text/css"> 
  #sky{ 
    background-color: red; 
    width: 150px; 
    height: 50px; 
    position: absolute; 
    left: 593px; 
  } 
</style> 
<script> 
  var sky = document.querySelector('#sky') 
  function skyMove(skyX) {  
    skyX = sky.style.left; 
    sky.style.left = skyX - 150 + 'px' 
  } 
    setInterval(skyMove, 1000)
</script>

По дате

По рейтингу

petr_alekseevich_1

Оракул

2г

Для получения текущих стилей другой код

 window.getComputedStyle(sky).left

При попытке считать через style. не получишь ничего

dlazder

Мудрец

2г

Даже не знаю в чем конкретно ошибка, для начала когда ты вызываешь функцию skyMove ты не передаешь в нее аргумент, но жачем то принимаешь его, удали skyX из скобок он тут ни к чему. Потом, переменная skyX у тебя не объявляется, где let? И наконец, если style.left и возвращает что то то возвращает строку, вот что ты пытаешься сделать:

 '593px' - 150 + 'px'

frantsisk_1_1

Просветленный

2г

Возможно, потому что возникает непонятная ситуация.
sky.style .left = '593px' - 150 + 'px'

user_72847397

Мастер

2г

Для движения div вправо с использованием setInterval, вы можете создать следующий код на JavaScript:

123456789101112131415161718192021222324252627282930313233

 <!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Move Div</title> 
    <style> 
        #movingDiv { 
            position: absolute; 
            width: 100px; 
            height: 100px; 
            background-color: red; 
            left: 0; 
        } 
    </style> 
</head> 
<body> 
    <div id="movingDiv"></div> 
 
    <script> 
        const div = document.getElementById('movingDiv'); 
        let position = 0; 
        const moveBy = 10; // Расстояние, на которое div будет двигаться каждую секунду 
 
        setInterval(() => { 
            position += moveBy; 
            div.style.left = position + 'px'; 
        }, 1000); 
    </script> 
</body> 
</html>

В этом примере создается div с идентификатором "movingDiv". С помощью setInterval, мы перемещаем div вправо на 10 пикселей каждую секунду (1000 мс). Вы можете изменить значение переменной moveBy для изменения скорости движения div.

Мой канал по Web программированию