用于在本地列出和显示图像的HTML页面

Question

这可能是一件非常简单的事情，但是已经很久了，因为我做过任何基于Web的事情，但我不知道从哪里开始，所以我想请您乐于助人，希望有人可能知道我可以在网上某处掠夺想法的好例子。

我有一个装满图像的文件夹，我想创建一个html页面，该页面的右侧是上述图像的列表，左侧可以显示这些图像的许多面板/空间，然后用户可以从列表中拖动进入面板，然后将显示图像。然后，用户可以将图像拖出以将其删除（右键单击选项也可以），或者将其他图像拖入以替换它们。

我确定这种事情可以在jquery中完成，但是我不知道从哪里开始，任何人有什么建议吗？

谢谢！

Answer 1

您是否正在寻找类似的东西？这将使其在jquery中可拖动。但是，插件将需要这样做。

<script type="text/javascript">
$(function() {
    $("Insert ID or CLASS").draggable();
});
</script>

但是，为了防止将可拖动的类或ID拖动到任何地方，可以使用以下代码：

$(function() { $( "ID OR CLASS" ).draggable({ containment: "window" }); });

阅读API https://api.jqueryui.com/draggable/#option-containment以获得更多信息。

这是在jquery中添加内容的方法：

$("ID OR CLASS").droppable();

我建议您在将类拖到div时在类上使用toggle()。因此，当您删除一个类时，图像将被删除，而不是div。

我希望这对您入门有帮助。尽管这个问题还不清楚，我希望您将其编辑为更有用的一个问题（这样其他人也可以从中受益），但我仍然祝您一切顺利！