为了账号安全,请及时绑定邮箱和手机立即绑定

检查几次,不知道问题在哪。。。求助

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>jQuery动画特效</title>
             <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<style type="text/css">
div
{width:100px;
height:100px;
background-color:red;
margin:10px auto;}
</style>
    </head> 
    <body>
    <input id="left" type="button" value="左移"></input>
    <input id="right" type="button" value="右移"></input>
    <script type="text/javascript">
   $(function (){
    $("#left").bind("click",function(){
    $("div").animate({left:"+=50px"},800);
                });
     $("#right").bind("click",function(){
     $("div").animate({left:"-=50px"},800);
                });               
        });
            
    </script>
      <div></div>  
    </body>
</html>

问题在哪啊?

正在回答

2 回答

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>jQuery动画特效</title>
             <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<style type="text/css">
div
{width:100px;
height:100px;
background-color:red;
margin:10px auto;
position:absolute;
}
</style>
    </head> 
    <body>
    <input id="left" type="button" value="左移"></input>
    <input id="right" type="button" value="右移"></input>
    <script type="text/javascript">
       $(function (){
            $("#left").bind("click",function(){
                $("div").animate({left: "150px"}, 800);
            });
            $("#right").bind("click",function(){
                $("div").animate({right: "-50px"}, 800);
            });               
        });            
    </script>
      <div></div>  
    </body>
</html>

如需对位置进行操作,记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。

1 回复 有任何疑惑可以回复我~
#1

紫漾 提问者

谢谢谢谢~~一直在纠结~~~
2015-09-07 回复 有任何疑惑可以回复我~

使用animate动画的元素需要设置position属性

0 回复 有任何疑惑可以回复我~
#1

紫漾 提问者

谢谢~
2015-09-11 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
jQuery基础课程
  • 参与学习       154768    人
  • 解答问题       7184    个

加入课程学习,有效提高前端开发速度

进入课程

检查几次,不知道问题在哪。。。求助

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信