拖到调整分区大小
拖到调整分区大小
提问于 2016-04-06 18:15:05
我的现场页面：
http://rafflebananza.com/Admin/Desktop/index123.html#
我使用的JQuery：
- jquery-1.11.0.min.js
- jquery-migrate-1.2.1.min.js
- jquery-ui-1.10.3.custom.min.js
问题是：
我想让我的快速边栏，你看到的右边边与三个标签，有一个可拖动的宽度。我试过几次，但都没有成功；
代码尝试：
$('.Quick-Sidebar').resizable({
handles: 'w'
});虽然我已经看到了像这个JSFiddle这样的工作，但是在我的站点上实现它似乎不起作用，而更新到最近的JQuery似乎并不适用于我的所有编码。
问题
我如何使我的边菜单可调整拖动，动态流体拖动，如果使用JQuery，我希望这样做，使用最小的JQuery css。
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-04-06 19:09:42
演示
您的可调整大小需要在包装器中。
在我的例子中，.Quick-Sidebar-Wrapper
包装程序需要与起始边栏宽度相同的宽度(322 as )。
.Quick-Sidebar-Wrapper{
position: relative;
height: 100vh;
float:right;
width: 322px;
}
.Quick-Sidebar{
position: absolute;
right: 0;
top: 0;
height: 100%;
outline: 1px solid #ccc;
overflow:hidden;
cursor: default;
}您还没有包含jquery，所以为.ui-resizable-handle ui-resizable-w添加一些自定义样式。这就是用来调整侧边栏大小的助手div。
.ui-resizable-w{
height:100%;
width:5px;
background:limegreen;
cursor: w-resize;
}使用以下命令运行插件：
$('.Quick-Sidebar').resizable({
handles: 'w'
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/36459166
复制相关文章
相似问题
腾讯云开发者
