Jquery动画从左到右不起作用

Question

为什么这不起作用？这应该是从左到右，然后再从左到右依次为箭头设置动画，依此类推，但这不起作用。那是为什么？

＆＃13;

＆＃13;

function moveRight(){
    $('#myIcon').animate({left: "+=50"}, 1000, function(){
        $('#myIcon').animate({left: "-=50"}, 1000, moveRight)
    })
}
moveRight();

＆＃13;

a{
  text-decoration: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="btn btn-danger btn-lg">
<span id="myIcon">←</span>&nbsp; Go Back
</a>

＆＃13;

＆＃13;

＆＃13;

Answer 1

将样式position:absolute添加到图标

function moveRight(){
    $('#myIcon').animate({left: "+=50"}, 1000, function(){
        $('#myIcon').animate({left: "-=50"}, 1000, moveRight)
    })
}
moveRight();

a{
  text-decoration: none;
}

#myIcon{
 position:absolute;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="btn btn-danger btn-lg">
<span id="myIcon">←</span>&nbsp; Go Back
</a>