如何动画用jQuery创建的图像？

Question

我创建了这样的事情

var pic = $('<img>').attr('src',someSrc); 
$('body').append(pic); 

我想这个图像动画在其上加入后身体右侧屏幕的某个位置，让我们这样说：

$(pic).animate({top:'270px', left: '500px'}, 'slow'); 

但不起作用。

Answer 1

编辑，更新

新增'，'之前，属性选择器内的双引号后，.css("position", "relative")到pic

---

尝试利用.find()用铁链锁.append()参数属性选择"[src='" + someSrc + "']"返回body元素

var someSrc = "http://lorempixel.com/200/200/technics"; 
 

 
var pic = $('<img>').attr('src',someSrc) 
 
      .css("position","relative"); 
 

 
$("body").append(pic) 
 
.find("[src='" + someSrc + "']") 
 
     .animate({ 
 
     top: "270px", 
 
     left: "500px" 
 
     }, "slow");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

我在浏览测试这一点，但似乎不能在摘要中工作过，可能是你还需要测试它在本地的HTML文件

var img = $('<img src="http://static.adzerk.net/Advertisers/36e3fe661d1c4e38885da2fb2c98b1fc.png">'); 
 
img.css('position', 'absolute'); 
 
$('div#testDiv').append(img); 
 
img.animate({ top: '270px', left: '500px' }, 'slow');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
 
<div id="testDiv"></div>

Answer 3

你必须添加一个“position：absolute”到你的图片。

var pic = $('<img style="position: absolute;">').attr('src', someSrc); 
$('body').append(pic); 

pic.animate({top:'270px', left: '500px'}, 'slow');