Jquery .animate不适用于固定位置

Question

这是我的.animate功能

<script>
       $(document).ready(function(){
$('#slide').click(function(){
$('#2guns').animate({right: 500},10000);
});
});
</script>

这是我正在制作动画的元素

 <div class="content">
            <button id="slide">slide</button>
           <img src="/home/varun/Documents/Crown/images/line.png" id="2guns" STYLE="position:absolute;left:1293px;">
        </div>

没有属性

，它完美无缺

left:1293px;

任何解决方案？

Answer 1

这是http://jsfiddle.net/kD3Zt/

 <div class="content">
        <button id="slide">slide</button>
       <img src="/home/varun/Documents/Crown/images/line.png" id="2guns" STYLE="position:absolute;left:1293px;">
    </div>

---

 $(document).ready(function(){
 $('#slide').click(function(){
 $('#2guns').animate({left: 200},10000);
 });
 });

Answer 2

这样做，元素不能同时具有左右两种风格

$('#2guns').animate({left: 500},10000);

DEMO

Answer 3

为什么要留下，请注明......

我试着用它做得很好......

<div class="content">
            <button id="slide">slide</button>
           <img src="/home/varun/Documents/Crown/images/line.png" id="2guns" STYLE="position:absolute; right:0px;">
        </div>