整个页面顶部的可拖动 div（在页面加载时）

Question

我正在开发一个应该包含可拖动元素的 Web 项目，我使用 javascript 和 jquery.

将其放置在页面中

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

我怎样才能做到这一点？

Answer 1

像这样使用position:absolute;：

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

已更新 Jsfiddle。

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

如下所示更改您的 CSS：

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

有了这个：

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

Draggable div on top of entire page (on page load)