jqueryUI：draggable句柄隐藏在div的顶部

Question

这可能是一个错误，但我不知道我做错了什么。

我遇到了制作JS Fiddle的麻烦，遗憾的是它在那里表现得很好，但如果你采用确切的代码并在chrome中本地运行它，jqUI句柄都位于元素的顶部而不是外边缘？这是小提琴：https://jsfiddle.net/ceL1j3kL

出于理智的考虑，我在本地运行时会包含此行为的屏幕图像。

在动态创建将要使用句柄的元素时，是否有人知道如何保持句柄的位置？

以下是我正在使用的完整资源：

HTML

<!DOCTYPE html>
<html>
    <head>
    <link rel="stylesheet" href="/style/chat.css" type="text/css"/>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script src="/scripts/test.js"></script>
    </head>
    <body>
    </body>
</html>

CSS

html, 
body {
    height: 100%;
    overflow: hidden;
    margin:0;
    padding:0;
}

JS

$(document).ready(function(){
    let c = $('<div id="container" style="width: 75%; height: 75%; background-color: black;">');
    c.appendTo($('body'));
    c.draggable({
        containment: 'body'
    });
    c.resizable({
        handles: 'all'
    });
});

我在本地运行时看到的行为的图像。你可以看到我徘徊在南手柄的图像上，南手柄位于元素的北部，不可点击....

Answer 1

您必须在项目中添加jquery-ui.css引用，例如：

<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

jqueryUI：draggable句柄隐藏在div的顶部

问题描述投票：2回答：1

1个回答

最新问题

jqueryUI：draggable句柄隐藏在div的顶部

问题描述 投票：2回答：1

1个回答

最新问题

问题描述投票：2回答：1