html 使用Javascript在div之间拖放图像

lymnna71  于 2023-03-16  发布在  Java
关注(0)|答案(1)|浏览(135)

我正在尝试创建一个游戏,但是我遇到了一些麻烦,当涉及到用户拖放嵌入在div中的图像。我目前正在使用这个tutorial来做这件事,但是我相信你可以猜到,它不工作。我已经附上了我的github repo下面的测试目的,目前你可以忽略python文件,因为它们与此问题无关。如果你发现如何使此工作,请随时让我知道,如果你需要更多信息,我很乐意提供它。
基本上,我有一个包含整个游戏的div,叫做container。在这个div中,有一堆包含列的div。然后在这些div中有div,里面包含图像。我试图从container div中移动div的图像,即从一行移动到下一行,或者从一列移动到下一列。然而,“删除”部分似乎不起作用。由于某种原因,它没有更新它,即使我实际上是从W3学校网站复制/粘贴代码。

yeotifhr

yeotifhr1#

此代码段将源容器中拖动的图像与目标容器中的图像交换。
该代码段还提供了仅移动的选项(即源容器插入到目标容器之前)。
使用CSS网格创建网格允许在不更改网格设置的情况下进行交换或移动。

/* Set the following CSS variables in JavaScript to allow for any grid size */
:root {
    --rows: 1;
    --cols: 1;
    --cell-size: 90px;
}

#grid-container {
    display: grid;
    grid-template-rows: repeat(var(--rows), var(--cell-size));
    grid-template-columns: repeat(var(--cols), var(--cell-size));
}

代码片段
x一个一个一个一个x一个一个二个一个x一个一个三个一个

相关问题