如何在HTML中创建图像的一部分div

Question

我正在为足球（足球）比赛创建一个网络应用程序。我有一个足球场图像的屏幕。

在该图像上，我放置了多个div来代表玩家。我想使用JQuery添加拖放功能来添加每个玩家的目标。

为此，我必须在目标上创建一个图层或div（因为目标已经是图像的一部分）;所以我可以将玩家拖到目标上来增加目标。

见下图。