Question

是否可以使用jquery在div中的单击位置添加图像？

我需要开发一款小游戏，主要是点击屏幕猜测一个位置 - 图片放在用户点击的任何地方......

我知道如何获得X＆amp;点击的地点的Y坐标 - 但不知道如何将图像放在该位置......

任何帮助都会很棒 - 完全收到！

干杯保罗

Answer 1

确保div设置为position: relative，然后在创建图片时将其设为position:absolute，并将top和left属性设置为您的点击坐标。像这样：

$('#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;
}

Jquery - 在特定坐标处添加图像

2 个答案: