HTML地图，我可以添加图像

Question

我需要一些关于我想要创建的Web应用程序设计的帮助。基本上我想从一个黑色背景开始..我说1000px X 1000px。然后在一个事件..小时说一个点击事件，我希望能够在我选择的坐标处在该背景的顶部添加一个星形的小图像。并继续这样做，直到我在黑色背景上有一堆星星。

我不知道如何设置我的html才能做到这一点。一旦我有了整体设计，我可以从那里拿走它，我只是不知道从哪里开始。

语言：HTML，Javascript，CSS

开始图片：

要添加的图片：

结束图片：

Answer 1

http://jsfiddle.net/mpprq3r3/

这是一个非常简单的例子。看看它是如何完成的，并根据您的需求进行更改。

$(".canvas").on("click", function(e) {
    var parentOffset = $(this).parent().offset();
    var relX = e.originalEvent.pageX - parentOffset.left;
    var relY = e.originalEvent.pageY - parentOffset.top;
    console.log(relX)

    $(this).append("<div class='item' style='top:"+(relY-5)+"px;left:"+(relX-5)+"px'><img src='http://i.stack.imgur.com/4Crjc.png' /></div>");
});