如何从右向左滑动 JQuery HTML CSS

Question

$(document).ready(function() {
  $("#One").click(function() {
    $("#Two").animate({
      width: 'toggle'
    }, -10);
  });
});

<script src="jquery-3.2.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-
    3.2.1.min.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://jquery-
    ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js"></script>
<script src="http://jquery-
    ui.googlecode.com/svn/tags/latest/ui/jquery.effects.slide.js">
</script>
<script>
</script>

<div id="One" style="width:50px;height:200px;background-
     color:yellow;position:relative;top:300px;left:600px;">One</div>
<div id="Two" style="width:200px;height:200px;background-
    color:black;position:relative;top:100px;left:400px;">Two</div>

上面是代码，我的问题就是我不能让它正常滑动。当我单击它时，它会消失，然后在第二次单击时又回来。我只是想让它正常滑动。

Answer 1

尝试添加这个::

$(document).ready(function() {
  $("#One").click(function() {
    $("#Two").animate({
      left: '400px'
    });
  });
});