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

为什么不能同时用left:“+=50px”和right:“”+=50px

使用animate()方法进行动画,为什么不能同时用left:“+=50px”和right:“”+=50px;

同时用的话,会存在问题:

<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>jQuery动画特效</title>

        <style type="text/css">

#block{

position: relative;

width: 50px;

height: 50px;

background-color: red;

margin:10px;

}

        </style>

        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

    </head>

    

    <body>

        <div id="block"></div>

        <form action="#">

        <input type="button" value="左移" />

        <input type="button" value="右移" />

        </form>

        <script type="text/javascript">

        $(function(){

        $("input[value='左移']").bind('click',function(){

        $("#block").animate({right:"+=50px"},500);

        });

        $("input[value='右移']").bind('click',function(){

        // $("#block").animate({left:"+=50px"},500);  这里改变left的属性为什么存在问题?

        $("#block").animate({right:"-=50px"},500); 

        });

        });

        </script>

    </body>

</html>


正在回答

5 回答

如果这样写,你往右走了,在想往左,就不会从当前的位置移动了,而是会从初始值移动

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

我试了两次  都可以的啊   这个不是同时左右移  是点击按钮触发  按钮是左移就坐  没有什么冲突的  

你的错误提示是什么 


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

Eason_Mar 提问者

$("input[value='左移']").bind('click',function(){ $("#block").animate({right:"+=50px"},500); }); $("input[value='右移']").bind('click',function(){ $("#block").animate({left:"+=50px"},500); 你确认你使用的是这个写法?我遇到的问题是:右移之后就无法左移了!
2016-04-12 回复 有任何疑惑可以回复我~
#2

Eason_Mar 提问者

我的代码目前是OK的,但是如果你替换了这两句,就有问题了: $("#block").animate({left:"+=50px"},500); 这句有问题; $("#block").animate({right:"-=50px"},500); 这句没问题;
2016-04-12 回复 有任何疑惑可以回复我~
#3

仁太 回复 Eason_Mar 提问者

试出来了 这个把left或者right都改成同一个 然后用-=和+=能实现 你试试你的代码先点左移 多点几下 然后点一下右移 会发现动画会直接从初始位置开始右移 不是从你左移后的位置开始右移的 这个应该和animate这个自身源码的设置有关 里面应该有定位的问题 所以导致的设置不同属性改变会不可用
2016-04-12 回复 有任何疑惑可以回复我~
#4

Eason_Mar 提问者 回复 仁太

我知道把left或者right都改成同一个 然后用-=和+=能实现,但还是不明白为什么分别用left或者right会出现以上异常。还是谢谢你的耐心回复!(*^__^*)
2016-04-12 回复 有任何疑惑可以回复我~
查看1条回复

我试了一下,没问题啊

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

Misaya_hu

没问题,可以向右移
2016-04-10 回复 有任何疑惑可以回复我~
#2

Eason_Mar 提问者 回复 Misaya_hu

你重复试一下,是有问题的。
2016-04-11 回复 有任何疑惑可以回复我~

就像一个人叫你向左,另一个人叫你向右,你能左右都同时进行?

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

不同元素,同时左右移没有问题,对同一个元素而言,向左又向右,太不科学了吧

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

Eason_Mar 提问者

解释一下怎么不科学嘞。
2016-04-10 回复 有任何疑惑可以回复我~
#2

慕粉3167675 回复 Eason_Mar 提问者

初学,只是感觉左右同时进行,会有问题吧!
2016-04-11 回复 有任何疑惑可以回复我~

举报

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

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

进入课程

为什么不能同时用left:“+=50px”和right:“”+=50px

我要回答 关注问题
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号