让我更具体一点...我不希望 DIV 在我拖动时调整大小。我想将它拖出(可能有一条垂直线跟随我的光标),当我松开时,它会调整 div 的大小。
最佳答案
看看这个例子
HTML
<div id="sidebar">
<span id="position"></span>
<div id="dragbar"></div>
sidebar
</div>
<div id="main">
main
</div>
jquery
var dragging = false;
$('#dragbar').mousedown(function(e){
e.preventDefault();
dragging = true;
var main = $('#main');
var ghostbar = $('<div>',
{id:'ghostbar',
css: {
height: main.outerHeight(),
top: main.offset().top,
left: main.offset().left
}
}).appendTo('body');
$(document).mousemove(function(e){
ghostbar.css("left",e.pageX+2);
});
});
$(document).mouseup(function(e){
if (dragging)
{
$('#sidebar').css("width",e.pageX+2);
$('#main').css("left",e.pageX+2);
$('#ghostbar').remove();
$(document).unbind('mousemove');
dragging = false;
}
});
演示在 http://jsfiddle.net/gaby/Bek9L/1779/
这是对我在 Emulating frame-resize behavior with divs using jQuery without using jQuery UI? 中发布的代码的改动
关于jquery - 如何通过仅拖动它的一侧来调整 DIV 的大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6219031/