灵活的显示div层:根据当前位置onmouseover时向上、向下或向左向右显示 读取onmouseover所触发的事件,设置div的left、top,把事件得到的坐标加一定的偏移值就可以啦 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 var RightEdge = document.body.clientWidth-event.clientX; //获取当前鼠标右键按下后的位置,据此定义菜单显示的位置 var BottomEdge = document.body.clientHeight-event.clientY; var oDivElement = document.getElementById("DivID"); if (RightEdge <oDivElement.offsetWidth) //如果从鼠标位置到窗口右边的空间小于菜单的宽度,就定位菜单的左坐标(Left)为当前鼠标位置向左一个菜单宽度 { document.oDivElement.style.left = document.body.scrollLeft + event.clientX - oDivElement.offsetWidth; } else //否则,就定位菜单的左坐标为当前鼠标位置 { oDivElement.style.left = document.body.scrollLeft + event.clientX; } if (BottomEdge <document.getElementById("ClickMenu").offsetHeight) //如果从鼠标位置到窗口下边的空间小于菜单的高度,就定位菜单的上坐标(Top)为当前鼠标位置向上一个菜单高度 { oDivElement.style.top = document.body.scrollTop + event.clientY - oDivElement.offsetHeight; } else //否则,就定位菜单的上坐标为当前鼠标位置 { oDivElement.style.top = document.body.scrollTop + event.clientY; } 是不是这样?<script>var x,y,a,b;document.onmousemove=function(event){var e =event||window.eventif(!x){x=e.clientX;y=e.clientY;return}if(x>e.clientX) {x=e.clientX; document.getElementById("ss").style.left=e.clientX-102+"px" }else{x=e.clientX;document.getElementById("ss").style.left=e.clientX+2+"px"}if(y>e.clientY){y=e.clientY; document.getElementById("ss").style.top=e.clientY-42+"px" }else{y=e.clientY;document.getElementById("ss").style.top=e.clientY+22+"px"}}</script><div id="ss" style="height:40px; width:100px; border:1px solid #000000; position:absolute"></div> 思路: 1 获取你鼠标的位置与边界之间的差值a 2 a与div宽或者高作比较 3 根据比较的结果改变div的位置 如果你的当前位置指鼠标坐标的话,那先取得坐标的xy值,然后用下面的方法,获得对应div的位置信息。再判断x+对象的W是否超过屏幕宽度来决定对象显示的X坐标,用同样的方法来决定对象显示的Y坐标。如果超过屏幕宽度则X坐标=鼠标x-对象宽度如果超过屏幕高度则y坐标=鼠标y-对象高度或者也可以和屏幕齐边,用屏幕的宽度或高度减去对象宽度或者高度即可。//获得obj的位置信息 this.getpos = function(o){ p.t=parseInt((o.style?o.style.top:0)||o.offsetTop||o.clientTop||0);// p.l=parseInt((o.style?o.style.left:0)||o.offsetLeft||o.clientLeft||0);// p.w=parseInt(o.offsetWidth||o.clientWidth);// p.h=parseInt(o.offsetHeight||o.clientHeight);// return p; } javascript 如何等到事件响应结束 才继续执行 关于iframe的问题,高手指点一下!!! 关于div的问题 慌了,遇到个大难题,谁帮忙看看。 有没有脚本给图片下方添加图片的名字的? 在多样式中,select、checkbox、radio边框颜色不统一,要如何设置 document.documentElement.offsetWidth | scrollLeft 在ie,ff中有区别吗 问一个问题:关于图片显示时间的 关于选中的checkbox的总数的获取 怎么做出这效果 如何自定义js鼠标右键菜单,替换原有的右键菜单 求一个鼠标点击两边箭头,图片可以左右滑动的js代码?
var BottomEdge = document.body.clientHeight-event.clientY;
var oDivElement = document.getElementById("DivID");
if (RightEdge <oDivElement.offsetWidth) //如果从鼠标位置到窗口右边的空间小于菜单的宽度,就定位菜单的左坐标(Left)为当前鼠标位置向左一个菜单宽度
{
document.oDivElement.style.left = document.body.scrollLeft + event.clientX - oDivElement.offsetWidth;
}
else //否则,就定位菜单的左坐标为当前鼠标位置
{
oDivElement.style.left = document.body.scrollLeft + event.clientX;
}
if (BottomEdge <document.getElementById("ClickMenu").offsetHeight) //如果从鼠标位置到窗口下边的空间小于菜单的高度,就定位菜单的上坐标(Top)为当前鼠标位置向上一个菜单高度
{
oDivElement.style.top = document.body.scrollTop + event.clientY - oDivElement.offsetHeight;
}
else //否则,就定位菜单的上坐标为当前鼠标位置
{
oDivElement.style.top = document.body.scrollTop + event.clientY;
}
<script>
var x,y,a,b;
document.onmousemove=function(event){
var e =event||window.event
if(!x)
{x=e.clientX;y=e.clientY;return}
if(x>e.clientX)
{x=e.clientX;
document.getElementById("ss").style.left=e.clientX-102+"px"
}
else
{x=e.clientX;
document.getElementById("ss").style.left=e.clientX+2+"px"
}if(y>e.clientY)
{y=e.clientY;
document.getElementById("ss").style.top=e.clientY-42+"px"
}
else
{y=e.clientY;
document.getElementById("ss").style.top=e.clientY+22+"px"
}
}
</script><div id="ss" style="height:40px; width:100px; border:1px solid #000000; position:absolute"></div>
1 获取你鼠标的位置与边界之间的差值a
2 a与div宽或者高作比较
3 根据比较的结果改变div的位置
如果超过屏幕宽度则X坐标=鼠标x-对象宽度
如果超过屏幕高度则y坐标=鼠标y-对象高度
或者也可以和屏幕齐边,用屏幕的宽度或高度减去对象宽度或者高度即可。
//获得obj的位置信息
this.getpos = function(o){
p.t=parseInt((o.style?o.style.top:0)||o.offsetTop||o.clientTop||0);//
p.l=parseInt((o.style?o.style.left:0)||o.offsetLeft||o.clientLeft||0);//
p.w=parseInt(o.offsetWidth||o.clientWidth);//
p.h=parseInt(o.offsetHeight||o.clientHeight);//
return p;
}