Javascript 可移动div，但仅可移动div头以移动所有div内容

我想使应用程序看起来像windows资源管理器。我正在搜索构建我的应用程序所需的内容

可排水

ajax请求

等等

对于阿贾克斯，我被找到了。而且它也能工作。 但我对jquery moveable div有问题（我从csstrick找到它） 你可以看到我从codepen用这个做了什么

我的问题是: 如何创建可移动的jquery，但只有标头可以移动整个div。？ 请不要建议我使用jQueryUI或jQueryEasyUI。我只想从0构建我的应用程序，而不是使用ui/easyui这样的现成框架。 我对jquery/javascript不太了解。但有了这个应用程序，我想知道为什么我不使用ui/easyui

如果你有链接/谷歌建议关键字，请告诉我。 对不起，我的语法或语言

谢谢你的建议

编辑1：

假设虚拟代码是这样的

<div class="move">
<div class="title">This is title</div>
<div class="content"></div>
</div>

这是标题

如果我像在codepen的示例中那样使用csstrick中的代码。我可以在

move

区域中移动div。但是我想要的是我可以移动

移动

div，只需从

标题

编辑2。 这是csstrick的原始脚本

编辑3

我找到了我想要的

---

仔细查看您的代码：

opt = $.extend({handle:"",}, opt);
    //if handle is empty drag by its container, else with the handle element
    if(opt.handle === "") {
        var $el = this;
    } else {
        var $el = this.find(opt.handle);
    }

正如您所看到的，您可以指定一个

选择器

来处理拖动操作，只需传递标题选择器

$('.widget').drags({handle:".title"});

---

更新了你的笔：

如果你不想使用jQuery UI，至少研究一下你感兴趣的插件的源代码，了解它们是如何工作的。我仔细阅读了csstrick的代码，但我对jQuery/javascript一无所知。所以我需要更多的例子。谢谢我在这里学到了一些新东西。谢谢你的解释。下次我会更仔细地阅读代码。