使图像每隔几秒在一个div中随机出现......如何？

简单的问题，我有这个DIV权利，400 * 250像素。我有这个图像，fooi.png。我该如何让fooi.png每隔2秒随机出现在该div的某个位置（并且它不会移除已经出现的其他图像）？使图像每隔几秒在一个div中随机出现......如何？

编辑：

我已经有了：

 function placeimage(){ 
      $('#div').append('<img src="fooi.png" alt="image" id="'. Math.floor(Math.random()*55) .'" onclick="doclick(this.id);">'); 
      setTimeout(placeimage, 2000); 
     } 

     placeimage();

来源

2011-04-25 Thew

你要问具体的问题显示的代码，你都试过了。毛毯我该怎么做这不是这个网站的工作原理请编辑你的问题 – mcgrailm 2011-04-25 00:36:21

@mcgrailm你的具体意思是什么？我不能真正解释它更好，我只是想产生一个标签与fooi.png在里面，在该div的某处。 – Thew 2011-04-25 00:37:44

显示你已经尝试或正在尝试做什么以及在哪里遇到问题。一个好的起点是使用计时器 – mcgrailm 2011-04-25 00:43:11

写一些CSS第一

#div img {position: relative; float: left }

和JavaScript的一些如何这样下面

function placeimage(){ 
     var t = $('<img src="fooi.png" alt="image" id="' + Math.floor(Math.random()*55) + '" onclick="doclick(this.id);">'); 
     $('#div').append(t); 
     t.css('left', Math.floor(Math.random()*(400 - t.width()))); 
     t.css('top', Math.floor(Math.random()*(250 - t.height()))); 
     setTimeout(placeimage, 2000); 
    } 

    placeimage();

来源

2011-04-25 01:13:31

使用setInterval()：

function placeimage(){ 
    $div = $('#div'); 
    $div.css('position','absolute'); 
    id = 'ranimg'+Math.floor(Math.random()*55); 
    left = Math.floor(Math.random()*parseInt($div.innerWidth())); 
    top = Math.floor(Math.random()*parseInt($div.innerHeight())); 
    $div.append('<img src="http://www.gravatar.com/avatar/e1122386990776c6c39a08e9f5fe5648?s=128&d=identicon&r=PG" alt="image" id="'+id+'" onclick="doclick(this.id);" style="display: none; position: relative;">'); 
    $img = $('#'+id); 
    $img.css('top',left+'px'); 
    $img.css('left',top+'px'); 
    $img.show(); 
    setInterval(function(){placeimage();}, 15000); 
} 

placeimage();

http://jsfiddle.net/userdude/HfLZ4/

来源

2011-04-25 00:56:30

好的，这也可以创建超时，但我仍然想让我的图像在div内的随机点上！？！而这个答案并不能帮助... – Thew 2011-04-25 01:00:19

@Thew - 请参阅编辑。 – 2011-04-25 01:05:36

@Thew - 我上次评论后的一些修改。 – 2011-04-25 01:09:03

使图像每隔几秒在一个div中随机出现......如何？

回答

相关问题