【问题标题】:Drag and Drop HTML (placeholder)拖放 HTML(占位符)
【发布时间】:2018-10-25 06:51:00
【问题描述】:

谁能帮我拖放占位符。我有 2 行(左右),每行有 5 个项目。

我想用简洁的动画显示占位符 (border-style: dotted;)。 Soo .. 在我放下要显示边框的项目之前。

您可以在下面找到我在 w3school

中使用的示例

https://www.w3schools.com/html/html5_draganddrop.asp

我希望它看起来如何!

【问题讨论】:

标签: css drag-and-drop draggable html5-draggable


【解决方案1】:

如果您使用纯 javascript

我在 w3schools 上为您创建了这个解决方案:

https://www.w3schools.com/code/tryit.asp?filename=FRCFSRF5F4RW

请参阅 ondragstartondragend。那里调用的函数,将边框设置为虚线或回到实线。您当然可以使用 css 值来放置,但这是基本实现。

如果你使用 jQuery ui 拖动:

在 jQuery 可拖动中使用“拖动”事件:

$( "#draggable" ).draggable({
  drag: function() {
    $("#YOUR_PLACEHOLDER").css("border", "1px dotted black");
  }
});

更多信息请看这里:https://jqueryui.com/draggable/#events

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-06-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-09-13
    • 1970-01-01
    相关资源
    最近更新 更多