一个类似confirm的提示菜单效果,鼠标定位还不是很完美,希望能改进!
效果图:

javascript代码:
<script type="text/javascript">
/*=============================================================================
程序名:Comfirm。
完成时间:2008-6-5
作者:djlong
E-mail:[email]dengjiulonge@163.com[/email]
更新日期:2008-6-5
=============================================================================*/
function $Confirm(evt,elem)
{
//-----------------------------------------------------------------------------//
this.body=document.body;
//-----------------------------------------------------------------------------//
var popWinow = $("PopupWindow");
if(popWinow)
{
document.body.removeChild(popWinow);
}
var popWin = document.createElement("div");
popWin.setAttribute("id","PopupWindow");
var innerRim = document.createElement("div");
innerRim.innerHTML = "<strong>您确定要删除吗?</strong><a href=\"javascript:$Delete()\" id=\"delete\">删除</a><a href=\"javascript:$Hide()\">取消</a>"
var oldele = $getSize(evt,elem);
popWin.style.display = 'block';
popWin.style.left = oldele.left - 55 + "px";
popWin.style.top = oldele.top - 50 + "px";
$appendTo(innerRim,popWin);
$appendTo(popWin,this.body);
}
//-----------------------------------------------------------------------------
//执行删除命令。
//-----------------------------------------------------------------------------
var $Delete = function()
{
$Hide();
alert("你被删除了!\r这里可以执行异步处理。@V@");
}
//-----------------------------------------------------------------------------
//将指定OBJ移除
//-----------------------------------------------------------------------------
var $Hide = function()
{
var popWinow = document.getElementById("PopupWindow");
document.body.removeChild(popWinow);
}
//-----------------------------------------------------------------------------
//得到指定id对象。
//-----------------------------------------------------------------------------
var $ = function(obj){
return document.getElementById(obj);
}
//-----------------------------------------------------------------------------
//得到指定OBJ坐标
//-----------------------------------------------------------------------------
var $getSize = function(e,altbox)
{
e=e || window.event;
var body = document.body;
var left = body.scrollLeft + e.clientX + 5;
left = (left>body.clientWidth-altbox.clientWidth) ? (left-altbox.clientWidth) : left;
var top = body.scrollTop + e.clientY + 5;
top = (top>body.clientHeight-altbox.clientHeight) ? (top-altbox.clientHeight) : top;
var data={"top":top,"left":left}
return data;
}
//-----------------------------------------------------------------------------
//将指定OBJ追加到某个OBJ的最后面。
//-----------------------------------------------------------------------------
var $appendTo = function (pObj,pTargetObj){
try{
pTargetObj.appendChild(pObj);
}catch(e){
alert(e.message);
}
}
</script>
演示页面及源代码下载地址:
confirm.htm (4.14 KB)

请稍等,评论加载中...