【发布时间】:2015-06-17 21:15:40
【问题描述】:
我有一个带有自定义上下文菜单的图片库。当我右键单击图像时,菜单位置是相对于光标坐标的。
如果坐标+div大小>窗口大小,则div的位置发生变化,div应该在img里面。
当我在图像中单击并且坐标+ div 大小为 窗口大小的位置时,有时效果很好,有时 div 位置似乎不符合 jvascript 条件。没看懂。
代码如下:
gary.addEventListener('contextmenu', gallery);
function gallery(e){
e.preventDefault();
var reh=e.clientY;
var rey=e.clientX;
var cnx=conxm.clientHeight;
var cxm=conxm.clientWidth;
var gig=window.innerHeight;
var fgi=window.innerWidth;
if((reh+cnx)>=gig && (rey+cxm)<=fgi){
conxm.style.top=((gig-cnx)-10)+"px";
conxm.style.left=rey+"px";
}
else if((reh+cnx)<=gig && (rey+cxm)>=fgi){
conxm.style.top=reh+"px";
conxm.style.left=((fgi-cxm)-10)+"px";
}
else if((reh+cnx)>=gig && (rey+cxm)>=fgi){
conxm.style.top=((gig-cnx)-10)+"px";
conxm.style.left=((fgi-cxm)-10)+"px";
}
else{
conxm.style.top=reh+"px";
conxm.style.left=rey+"px";
}
conxm.style.display="block";
}
<div id="curtain">
<div id="txt">
</div>
<div id="rev">
<img src="../img/revi.png" onClick="rvs()">
</div>
<img src="" name="gary">
<div id="frw">
<img src="../img/reviv.png" onClick="fwd()">
</div>
</div>
编辑:如果为 div 定义了宽度和高度,则该函数有效,但我需要宽度是可变的。
【问题讨论】:
-
你能创建一个fiddle吗?
-
这是小提琴:jsfiddle.net/zee9jxeg
标签: javascript html css