返回首页

温馨提示：本站文章标题使用的字体是《微软雅黑》点击下载这个字体. (提取码 441908ee)

顶一下

0 次

仿QQ消息管理器的样式[自定义右键修正版]

来源：网页素材 wangyesucai.com 编辑：ququhu 时间：2008-09-19 14:19:41 浏览：正在统计中...

<!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>
<style type="text/css">
<!--
html {
	scrollbar-face-color: #C9EBFC;
	scrollbar-highlight-color: #fff;
	scrollbar-3dlight-color: #A7DFFA;
	scrollbar-darkshadow-color: #A7DFFA;
	scrollbar-Shadow-color: #A7DFFA;
	scrollbar-arrow-color: #72B1D8;
	scrollbar-track-color: #EFEFE7;
}

body { border:0px; background: #fff; text-align: center; font-family: Verdana, sans-serif; margin:0; padding:0; font-size:12px; color:#000;}
div {text-align:left;}
.msgbox { width:auto; height:auto; overflow:hidden; margin:5px; background:#fff; }
.msgbox h1 { color:#3E659F; font-size:14px; border-bottom:1px solid #BBCDDE; height:30px; line-height:30px; padding:0 10px; }
.msgbox ul { padding:0; margin:0; list-style:none; }
.msgbox li { padding:3px 10px; margin:0; line-height:20px; }
.msgbox li p { text-indent:1em; padding:0; margin:0; }
.msgbox li p a { margin:0 4px;color:#BD0000; text-decoration:none; }
.msgbox li p a:hover { color:#006EFE; text-decoration:underline; }
.msgbox li span { color:#006EFE; display:block; }
.msgbox_a { border:1px solid #fff; }
.msgbox_hover { border:1px solid #C3DFF4; background: #F1FAFE; }
-->
</style>
<script language="javascript">
/**
*根据传入的id显示右键菜单
*/
function showMenu(id,user_name)
{
 menuForm.id.value = id;
 menuForm.username.value=user_name;
 // menuForm.sel_username =user_name; //选中的好友
 if("" == id)
 {
 ;//popMenu(itemMenu,100,"100");
 }
 else
 {
 popMenu(itemMenu,100,"111");
 }
 event.returnValue=false;
 event.cancelBubble=true;
 return false;
}
/**
*显示弹出菜单
*menuDiv:右键菜单的内容
*width:行显示的宽度
*rowControlString:行控制字符串，0表示不显示，1表示显示，如“101”，则表示第1、3行显示，第2行不显示
*/
function popMenu(menuDiv,width,rowControlString)
{
 //创建弹出菜单
 var pop=window.createPopup();
 //设置弹出菜单的内容
 pop.document.body.innerHTML=menuDiv.innerHTML;
 var rowObjs=pop.document.body.all[0].rows;
 //获得弹出菜单的行数
 var rowCount=rowObjs.length;
 //循环设置每行的属性
 for(var i=0;i<rowObjs.length;i++)
 {
 //如果设置该行不显示，则行数减一
 var hide=rowControlString.charAt(i)!='1';
 if(hide){
 rowCount--;
 }
 //设置是否显示该行
 rowObjs[i].style.display=(hide)?"none":"";
 //设置鼠标滑入该行时的效果
 rowObjs[i].cells[0].onmouseover=function()
 {
 this.style.background="#8CA9FF";
 this.style.color="#fff";
 }
 //设置鼠标滑出该行时的效果
 rowObjs[i].cells[0].onmouseout=function(){
 this.style.background="#F1FAFE";
 this.style.color="black";
 }
 }
 //屏蔽菜单的菜单
 pop.document.oncontextmenu=function()
 {
 return false;
 }
 //选择右键菜单的一项后，菜单隐藏
 pop.document.onclick=function()
 {
 pop.hide();
 }
 //显示菜单
 //pop.show(event.clientX-1,event.clientY,width,rowCount*25,document.body);
 pop.show(event.clientX-1,event.clientY+ getScroll(),width,rowCount*25,document.body);
 return true;
}
function getScroll()
{
	if (document.documentElement && document.documentElement.scrollTop) {
		return document.documentElement.scrollTop; 
				} 
		else if (document.body) { 
			return document.body.scrollTop; 
		} 
} 
function AddUser()
{
	document.getElementById('usercmd').href="comeonask://AddUser,"+menuForm.username.value+";";
	document.getElementById('usercmd').click();
 // alert("create" + menuForm.id.value + "!");
}
function LookDetail()
{
	document.getElementById('usercmd').href="comeonask://Detail,"+"/member/memberdetail.php?username="+menuForm.username.value+";";
	document.getElementById('usercmd').click();
	//alert("update" + menuForm.id.value + "!");
}
function Chat()
{
	document.getElementById('usercmd').href="comeonask://ShowChat,"+menuForm.username.value+";";
	document.getElementById('usercmd').click();
 // alert("delete" + menuForm.id.value + "!");
}
</script>
</head>
<body>
<form id="menuForm" name="menuForm">
<input type="hidden" id="id" name="id" value ="">
<input type="hidden" id="username" name="username" value ="">
</form>

<div id="itemMenu" style="display:none;">
<table width="100%" height="100%" bgcolor="#F1FAFE" border="0" style="border:1px solid #C3DFF4; cellspacing="1">
<tr>
<td style="text-align:left; padding-left:10px; cursor:default;border:outset 1;font-size:12px;" align="center" onclick="parent.AddUser();">
删除
</td>
</tr>
<tr>
<td style="text-align:left; padding-left:10px; cursor:default;border:outset 1;font-size:12px;" align="center" onclick="parent.LookDetail();">
删除全部
</td>
</tr>
<tr>
<td style="text-align:left; padding-left:10px; cursor:default;border:outset 1;font-size:12px;" align="center" onclick="parent.Chat();">
删除一行
</td>
</tr>
</table>
</div>
<div class="msgbox">
<ul>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
网址: 息内容消容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消息内容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
网址: 息内容消容消息内容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
<li oncontextmenu = "showMenu(1,'dddddddddd')"; class="msgbox_a" onmouseout="this.className='msgbox_a'" onmouseover="this.className='msgbox_hover'">
系统消息 2008-9-10 11:07:06
消息内容消息内容消容消息内容
</li>
</ul>
</div>
</body>
</html>

运行代码
复制代码
另存代码
收藏本页

提示：您可以先修改部分代码再运行，复制代码和保存代码功能在Firefox下无效。

修正了右键出现位置!

上一篇：仿QQ消息管理器的样式[自定义右键]

下一篇：简单的可编辑下拉框

赞助商友情链接

站长常用工具

更多

返回首页

仿QQ消息管理器的样式[自定义右键修正版]

赞助商友情链接

站长常用工具

热门点击