Javascript 你好，我想让4个对象在循环中从左向右移动，但我的代码不起作用_Javascript_Jquery_Html_Css

Javascript 你好，我想让4个对象在循环中从左向右移动，但我的代码不起作用

javascript jquery html css

Javascript 你好，我想让4个对象在循环中从左向右移动，但我的代码不起作用,javascript,jquery,html,css,Javascript,Jquery,Html,Css,这是您可以看到的html代码 <!DOCTYPE> <html> <head> <meta charset="UTF-8"> <link rel="stylesheet" type="text/css" href="style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></scr

这是您可以看到的html代码

 <!DOCTYPE>
 <html>
 <head>
 <meta charset="UTF-8">
 <link rel="stylesheet" type="text/css" href="style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

</head>

<body>
<div id="clouds">
<img border="0" alt="animated clouds" src="clouds.png" >
<script>
$(document).ready(function() {

function loop() {
    $('#clouds').css({right:0});
    $('#clouds').animate ({
        right: '+=1400',
    }, 5000, 'linear', function() {
        loop();
    });
}

loop();
 });
 </script>
 </div>
 <div id="clouds2">
 <img border="0" alt="animated clouds" src="clouds2.png" >
 <script>
 $(document).ready(function() {

function loop() {
    $('#clouds').css({right:0});
    $('#clouds').animate ({
        right: '+=1400',
    }, 5000, 'linear', function() {
        loop();
      });
   }

    loop();
  });

  </script>
 </div>

 </body>


 </html>




#clouds {
position:absolute;
z-index:500;
right:0px;
top:10px;
}


#clouds2{

position:absolute;
z-index:500;
right:0px;
bottom:10px;



 }


$（文档）.ready（函数（）{
函数循环（）{
$（'#clouds'）.css（{right:0}）；
$（“#云”）。设置动画({
右：'+=1400'，
}，5000，'线性'，函数（）{
loop（）；
});
}
loop（）；
});
$（文档）.ready（函数（）{
函数循环（）{
$（'#clouds'）.css（{right:0}）；
$（“#云”）。设置动画({
右：'+=1400'，
}，5000，'线性'，函数（）{
loop（）；
});
}
loop（）；
});
#云彩{
位置：绝对位置；
z指数：500；
右：0px；
顶部：10px；
}
#云2{
位置：绝对位置；
z指数：500；
右：0px；
底部：10px；
}

您可以看到这是css 我不明白为什么我的第二朵云不会移动这是困扰我的事情

如果有人帮我弄明白我真的迷路了，这将意味着很多。你也可以告诉我我在哪里搞砸了。如果你愿意，你不必更改代码，谢谢

!!!

您必须在脚本标记的第二部分中指定clouds2的移动/动画。您仍在使用

$（“#云”）

而不是

$（“#clouds2”）

必须在脚本标记的第二部分中指定clouds2的移动/动画。您仍在使用

$（“#云”）

而不是

$（“#clouds2'）

第一个错误是你给的是

$（“#clouds”）

而不是$（“#clouds2'），而且函数工作得很好，然后即使div调整得很好，图像仍然保持静止，所以我在

img

标记中添加了一个

float:left

，这使得图像按预期移动

$（文档）.ready（函数（）{
函数循环（）{
$（'#clouds2'）.css（'right'，0）；
$（'#clouds2'）。设置动画({
右：'+=1400'，
}，5000，'线性'，函数（）{
loop（）；
});
}
loop（）；
});
#云{
位置：绝对位置；
z指数：500；
右：0px；
顶部：10px；
}
#云2{
位置：绝对位置；
z指数：500；
左：0px；
底部：10px；
}
#clouds2>img{
浮动：对；
}
第一个错误是你给了$（“#clouds”）
而不是$（“#clouds2”），而且该函数工作得很好，然后即使div调整得很好，图像仍然保持静止，所以我在img
标记中添加了一个float:left
，这使得图像按预期移动

$（文档）.ready（函数（）{
函数循环（）{
$（'#clouds2'）.css（'right'，0）；
$（'#clouds2'）。设置动画({
右：'+=1400'，
}，5000，'线性'，函数（）{
loop（）；
});
}
loop（）；
});
#云{
位置：绝对位置；
z指数：500；
右：0px；
顶部：10px；
}
#云2{
位置：绝对位置；
z指数：500；
左：0px；
底部：10px；
}
#clouds2>img{
浮动：对；
}

非常感谢您，我犯了一个愚蠢的错误！非常感谢你，我犯了一个愚蠢的错误！