今天写了一天这个jquery插件:
可以实现对div进行拖拽来调整大小的功能。
代码如下:
(function ($) {
$.fn.dragDivResize = function () {
var deltaX, deltaY, _startX, _startY;
var resizeW, resizeH;
var size = 20;
var minSize = 10;
var scroll = getScrollOffsets();
var _this = this;
for (var i = 0; i < _this.length; i++) {
var target = this[i];
$(target).on("mouseover mousemove", overHandler);
}
function outHandler() {
for (var i = 0; i < _this.length; i++) {
target.style.outline = "none";
}
document.body.style.cursor = "default";
}
function overHandler(event) {
target = event.target || event.srcElement;
var startX = event.clientX + scroll.x;
var startY = event.clientY + scroll.y;
var w = $(target).width();
var h = $(target).height();
_startX = parseInt(startX);
_startY = parseInt(startY);
if ((0 < target.offsetLeft + w - _startX && target.offsetLeft + w - _startX < size) || (0 < target.offsetTop + h - _startY && target.offsetTop + h - _startY < size)) {
target.style.outline = "2px dashed #333";
if ((0 > target.offsetLeft + w - _startX || target.offsetLeft + w - _startX > size) && 0 < target.offsetTop + h - _startY && target.offsetTop + h - _startY < size) {
resizeW = false;
新闻热点
疑难解答
图片精选