需要将对象动画化到顶部并使其返回

Need to animate an object to top and make it go back

本文关键字：顶部 返回 对象 动画      更新时间：2023-09-26

我需要我的飞机飞上跑道（这是地图），然后点击回来。到目前为止，它只会上升。 任何与java script/html/jquery相关的内容。请提出简单的建议。泰^^ 这是我当前的代码： 

<div class="Map"><div id="MovingPlane1"></div></div>

.JS： 

<script type="text/javascript">
    $(document).ready(function(){
        $("#MovingPlane1").click(function(){
            $("#MovingPlane1").animate({bottom:"250px"},"slow");
        });
    });
<script>

jsBin demo

为您的两个平面提供一个类.plane并使用以下代码：

$(".plane").click(function(){
      
   $(this).animate({bottom:250},800,function(){
       $(this).animate({bottom:0},800);
   });
  
});

在动画回调中，重做初始位置。

尝试：

$(this).animate({bottom:"250px"},"slow",function(){
   $(this).animate({bottom:"0px"},"slow");
});

如果您需要飞机在第二次单击时返回，请使用以下命令：

var plane1up = false;
$(document).ready(function(){
    $("#MovingPlane1").click(function(){
        $("#MovingPlane1").animate({bottom:(plane1up==true ? "0px" : "250px")},"slow");
    });
});
相关文章：