javascript 菜初学者 javascript 拖动改变单元格大小
日期：2014-05-16 浏览次数：20314 次
javascript 菜菜鸟求教： javascript 拖动改变单元格大小
rt，在网上找了一些，都不太好使，目标，就是当鼠标放置到单元格之间时，鼠标变成双箭头形，而且可以进行拖动，请高手帮忙，谢谢
------解决方案--------------------
这个是原先写的鼠标效果。。如果要修改成LZ想要的效果只需要修改下即可。。。麻烦LZ自己改下好了。。偶要做东西的说。。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 鼠标特效 </title>
<script type= "text/javascript ">
var Class = {
//创建类
create : function () {
return function () {
this.initialize.apply(this, arguments);
};
}
};
var $A = function (a) {
//转换数组
return a ? Array.apply(null, a) : new Array;
};
Object.extend = function (a, b) {
//追加方法
for (var i in b) a[i] = b[i];
return a;
};
Object.extend(Object, {
addEvent : function (a, b, c, d) {
//添加函数
if (a.attachEvent) a.attachEvent(b[0], c);
else a.addEventListener(b[1] || b[0].replace(/^on/, " "), c, d || false);
return c;
},
delEvent : function (a, b, c, d) {
if (a.detachEvent) a.detachEvent(b[0], c);
else a.removeEventListener(b[1] || b[0].replace(/^on/, " "), c, d || false);
return c;
},
reEvent : function () {
//获取Event
return window.event ? window.event : (function (o) {
do {
o = o.caller;
} while (o && !/^\[object[ A-Za-z]*Event\]$/.test(o.arguments[0]));
return o.arguments[0];
})(this.reEvent);
}
});
Function.prototype.bind = function () {
//绑定事件
var wc = this, a = $A(arguments), o = a.shift();
return function () {
wc.apply(o, a.concat($A(arguments)));
};
};
var CMouse = Class.create();
CMouse.prototype = {
initialize : function (obj) {
//初始化参数
var wc = this;
wc.div = wc.init_div();
wc.click = null; //鼠标按下后记录其坐标
wc.sFunc = Object.addEvent(document, [ "onmousedown "], wc.sMove.bind(wc));
wc.iFunc = wc.eFunc = wc.dFunc = null;
},
init_div : function () {
//创建DIV，修改样式，并返回
var div = document.createElement( "div ");
with (div.style) {
position = "absolute ";
zIndex = 100;
overflow = "hidden ";
display = "none ";
width = height = top = left = "0px ";
border = "#CCCCCC 1px solid ";
backgroundColor = "#F4F4F4 ";
filter = "alpha(opcaity=50) ";
opacity = "0.5 ";
}
div.innerHTML = " ";
return document.body.appendChild(div);
},
reMouse : function () {
//获取鼠标位置
var e = Object.reEvent();
return {
x : document.documentElement.scrollLeft + e.clientX,
y : document.documentElement.scrollTop + e.clientY
};
},
eDiv : function (pos) {
//处理DIV
var wc = this, div = wc.div;
with(div.style) {
left = pos.left + "px ";
top = pos.top + "px ";
width = pos.width + "px ";
height = pos.height + "px ";
}
},
sMove : function () {
//鼠标按下后
var wc = this;
wc.clic
rt，在网上找了一些，都不太好使，目标，就是当鼠标放置到单元格之间时，鼠标变成双箭头形，而且可以进行拖动，请高手帮忙，谢谢
------解决方案--------------------
这个是原先写的鼠标效果。。如果要修改成LZ想要的效果只需要修改下即可。。。麻烦LZ自己改下好了。。偶要做东西的说。。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 鼠标特效 </title>
<script type= "text/javascript ">
var Class = {
//创建类
create : function () {
return function () {
this.initialize.apply(this, arguments);
};
}
};
var $A = function (a) {
//转换数组
return a ? Array.apply(null, a) : new Array;
};
Object.extend = function (a, b) {
//追加方法
for (var i in b) a[i] = b[i];
return a;
};
Object.extend(Object, {
addEvent : function (a, b, c, d) {
//添加函数
if (a.attachEvent) a.attachEvent(b[0], c);
else a.addEventListener(b[1] || b[0].replace(/^on/, " "), c, d || false);
return c;
},
delEvent : function (a, b, c, d) {
if (a.detachEvent) a.detachEvent(b[0], c);
else a.removeEventListener(b[1] || b[0].replace(/^on/, " "), c, d || false);
return c;
},
reEvent : function () {
//获取Event
return window.event ? window.event : (function (o) {
do {
o = o.caller;
} while (o && !/^\[object[ A-Za-z]*Event\]$/.test(o.arguments[0]));
return o.arguments[0];
})(this.reEvent);
}
});
Function.prototype.bind = function () {
//绑定事件
var wc = this, a = $A(arguments), o = a.shift();
return function () {
wc.apply(o, a.concat($A(arguments)));
};
};
var CMouse = Class.create();
CMouse.prototype = {
initialize : function (obj) {
//初始化参数
var wc = this;
wc.div = wc.init_div();
wc.click = null; //鼠标按下后记录其坐标
wc.sFunc = Object.addEvent(document, [ "onmousedown "], wc.sMove.bind(wc));
wc.iFunc = wc.eFunc = wc.dFunc = null;
},
init_div : function () {
//创建DIV，修改样式，并返回
var div = document.createElement( "div ");
with (div.style) {
position = "absolute ";
zIndex = 100;
overflow = "hidden ";
display = "none ";
width = height = top = left = "0px ";
border = "#CCCCCC 1px solid ";
backgroundColor = "#F4F4F4 ";
filter = "alpha(opcaity=50) ";
opacity = "0.5 ";
}
div.innerHTML = " ";
return document.body.appendChild(div);
},
reMouse : function () {
//获取鼠标位置
var e = Object.reEvent();
return {
x : document.documentElement.scrollLeft + e.clientX,
y : document.documentElement.scrollTop + e.clientY
};
},
eDiv : function (pos) {
//处理DIV
var wc = this, div = wc.div;
with(div.style) {
left = pos.left + "px ";
top = pos.top + "px ";
width = pos.width + "px ";
height = pos.height + "px ";
}
},
sMove : function () {
//鼠标按下后
var wc = this;
wc.clic
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
