javascript - 整个页面顶部的可拖动 div(页面加载时)

Question

我正在开发一个应包含可拖动元素的 Web 项目，我使用 javascript 和 jquery 将其放置在页面中。

一切都按预期工作，但是可拖动的 div 占用了其上方和下方的 div 之间的一些空间。我希望这个可拖动元素在加载页面后立即位于页面其余部分的顶部，即我希望它不占用上面的 div 和 div< 之间的空间 在下面，但要在所有内容之上生成。请参阅下面的视频和 jsfiddle。

我怎样才能完成这个任务？

JSFiddle

Answer 1

使用position:absolute;，如下所示:

$(function() {
  $("#draggable").draggable().css("position", "absolute");;
});

已更新Jsfiddle .

此外，在您的 CSS 中，您使用了错误的选择器类型。在 HTML 中，您有 id draggable ，在 CSS 中，您将其用作类。

如下所示更改您的 CSS:

.draggable { 
    z-index: 4000;
    width: 350px; 
    height: 350px; 
    padding: 0em;
}

这样:

#draggable { 
    z-index: 4000;
    width: 350px; 
    height: 350px; 
    padding: 0em;
}