js中在鼠标松开时触发mouseup事件判断此拖动DIV在哪一列并执行修改操作的代码怎么写,新手学习中,请高手指
就是我想拖动一个DIV到另一列,当鼠标松开时判断在哪一列并执行修改操作.比如,我将在左边一列中的DIV拖动到中间一列时判断此时DIV拖到中间列并修改它的一个段属于中间列,...
就是我想拖动一个DIV到另一列,当鼠标松开时判断在哪一列并执行修改操作.
比如,我将在左边一列中的DIV拖动到中间一列时判断此时DIV拖到中间列并修改它的一个段属于中间列,同样从中间拖动到右边列也是一样的操作,这样要怎么写代码,请高手指点,谢谢! 展开
比如,我将在左边一列中的DIV拖动到中间一列时判断此时DIV拖到中间列并修改它的一个段属于中间列,同样从中间拖动到右边列也是一样的操作,这样要怎么写代码,请高手指点,谢谢! 展开
2个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.tip
</style>
<script type="text/javascript">
var flag = true;
function getMouseXY(e){
var posx=0,posy=0;
if(e==null) e=window.event;
if(e.pageX || e.pageY){
posx=e.pageX; posy=e.pageY;
}
else if(e.clientX || e.clientY){
if(document.documentElement.scrollTop){
posx=e.clientX+document.documentElement.scrollLeft;
posy=e.clientY+document.documentElement.scrollTop;
}
else{
posx=e.clientX+document.body.scrollLeft;
posy=e.clientY+document.body.scrollTop;
}
}
return {
X : posx,
Y : posy
}
}
function getDiv(){
return document.createElement("div");
}
function g(id)
function showTip(){
if(!flag) return;
var domE = g("tip");
if(!domE){
domE = getDiv();
domE.setAttribute("id","tip");
document.body.appendChild(domE);
domE.className = "tip";
}
var m = getMouseXY();
with(domE.style){
top = (m.Y+20)+"px";
left = (m.X)+"px";
}
}
window.onload = function(){
document.documentElement.onmousemove = function()
document.documentElement.onmouseout = function(){
flag = true;
if(g("tip")) document.body.removeChild(g("tip"))
};
document.documentElement.onclick = function(){
flag = false;
if(g("tip")) g("tip").style.display = "none";
}
}
</script>
</head>
<body>
</body>
</html>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
除了FF，都行，自己写的。
2010-06-06 8:50am 修改 :
鼠标点击框内不再显示层，移出再移进时再次显示
2010-06-06 10:00am 修改
在body中显示
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.tip
</style>
<script type="text/javascript">
var flag = true;
function getMouseXY(e){
var posx=0,posy=0;
if(e==null) e=window.event;
if(e.pageX || e.pageY){
posx=e.pageX; posy=e.pageY;
}
else if(e.clientX || e.clientY){
if(document.documentElement.scrollTop){
posx=e.clientX+document.documentElement.scrollLeft;
posy=e.clientY+document.documentElement.scrollTop;
}
else{
posx=e.clientX+document.body.scrollLeft;
posy=e.clientY+document.body.scrollTop;
}
}
return {
X : posx,
Y : posy
}
}
function getDiv(){
return document.createElement("div");
}
function g(id)
function showTip(){
if(!flag) return;
var domE = g("tip");
if(!domE){
domE = getDiv();
domE.setAttribute("id","tip");
document.body.appendChild(domE);
domE.className = "tip";
}
var m = getMouseXY();
with(domE.style){
top = (m.Y+20)+"px";
left = (m.X)+"px";
}
}
window.onload = function(){
document.documentElement.onmousemove = function()
document.documentElement.onmouseout = function(){
flag = true;
if(g("tip")) document.body.removeChild(g("tip"))
};
document.documentElement.onclick = function(){
flag = false;
if(g("tip")) g("tip").style.display = "none";
}
}
</script>
</head>
<body>
</body>
</html>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
除了FF，都行，自己写的。
2010-06-06 8:50am 修改 :
鼠标点击框内不再显示层，移出再移进时再次显示
2010-06-06 10:00am 修改
在body中显示
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
核心就是各个元素定位，偷个懒，用JQuery:
HTML 代码:
<p>Hello</p><p>2nd Paragraph</p>
jQuery 代码:
var p = $("p:first");
var position = p.position();
$("p:last").html( "left: " + position.left + ", top: " + position.top );
得到目标位置和目的地位置，然后对高宽进行运算修正，判断，就行了
HTML 代码:
<p>Hello</p><p>2nd Paragraph</p>
jQuery 代码:
var p = $("p:first");
var position = p.position();
$("p:last").html( "left: " + position.left + ", top: " + position.top );
得到目标位置和目的地位置，然后对高宽进行运算修正，判断，就行了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
