Jquery - 特定の座標で画像を追加

Question

jqueryを使用してdiv内のクリックした位置に画像を追加することはできますか？

私は小さなゲーム基本的に位置を推測するには、画面をクリックする必要開発する必要がある - イメージはどこユーザーがクリック置かれているが...

私はその場所のX & Y座標を取得する方法を知っていますクリックされましたが、その位置に画像を配置する方法はわかりません...

どのようなヘルプも完全に受信されるでしょう！

乾杯 ポール

Answer 1

は、あなたのイメージがそれposition:absolute作る作成し、クリックの座標にtopとleftプロパティを設定する際のdivは、その後position: relativeに設定されていることを確認します。このような何か：

$('#yourdiv').append( 
    '<img src="/path/to/your/image.jpg" 
    style="width:auto;height:auto;position:absolute; 
      left:' + yourxcoord + ';top:'+ yourycoord +'" />"); 

Answer 2

あなたがここにhttp://jsfiddle.net/qA2jV/

jqueryのからの簡単な例を確認することができます。

$(document).click(function(e){ 
    $(".foo").remove() 
    $("body").append("<span class='foo'/>") 
    $(".foo").css("left",e.pageX) 
    $(".foo").css("top",e.pageY) 
}) 

CSS：

.foo{ 
    background-image:url("https://s-static.ak.facebook.com/rsrc.php/v1/ym/r/9vuAQCVid3f.png"); 
    background-repeat:no-repeat; 
    display:inline-block; 
    position:absolute; 
    height:16px; 
    width:16px; 
}