沈阳营销型网站建设 网站优化 seo优化 网络营销 就选同胜科技
咨询热线:024-83810631
首页 关于我们 成功案例 网站建设 SEO优化 全网营销 新闻资讯 联系我们
 

网页知识自定义右键菜单代码详解

日期:2012年09月03日 来源:沈阳AG游戏大厅(www.cheeme.com)

 

< style > 
< !-- 
/*定义菜单方框的样式1*/ 
.skin0 { 
position:absolute; 
text-align:left; 
width:200px; /*宽度,可以根据实际的菜单项目名称的长度进行适当地调整*/ 
border:2px solid black; 
background-color:menu; /*菜单的背景颜色方案,这里选择了系统默认的菜单颜色*/ 
font-family:Verdana; 
line-height:20px; 
cursor:default; 
visibility:hidden; /*初始时,设置为不可见*/ 

/*定义菜单方框的样式2*/ 
.skin1 { 
cursor:default; 
font:menutext; 
position:absolute; 
text-align:left; 
font-family: Arial, Helvetica, sans-serif; 
font-size: 10pt; 
width:200px; /*宽度,可以根据实际的菜单项目名称的长度进行适当地调整*/ 
background-color:menu; /*菜单的背景颜色方案,这里选择了系统默认的菜单颜色*/ 
border:1 solid buttonface; 
visibility:hidden; /*初始时,设置为不可见*/ 
border:2 outset buttonhighlight; 


/*定义菜单条的显示样式*/ 
.menuitems { 
padding-left:15px; /*左间距*/ 
padding-right:10px; /*右间距*/ 

-- > 
< /style > 

< SCRIPT LANGUAGE="javascript1.2" > 

< !-- 
//定义菜单显示的外观,可以从上面定义的2种格式中选择其一 
var menuskin = "skin1"; 
//是否在浏览器窗口的状态行中显示菜单项目条对应的链接字符串 
var display_url = 0; 

<b>function showmenuie5() {</b> 
//显示菜单 

//获取当前鼠标右键按下后的位置,据此定义菜单显示的位置 
var rightedge = document.body.clientWidth-event.clientX; 
var bottomedge = document.body.clientHeight-event.clientY; 

//如果从鼠标位置到窗口右边的空间小于菜单的宽度,就定位菜单的左坐标(Left)
为当前鼠标位置向左一个菜单宽度 
if (rightedge < ie5menu.offsetWidth) 
ie5menu.style.left = document.body.scrollLeft event.clientX - ie5menu.offsetWidth; 
else 
//否则,就定位菜单的左坐标为当前鼠标位置 
ie5menu.style.left = document.body.scrollLeft event.clientX; 

//如果从鼠标位置到窗口下边的空间小于菜单的高度,就定位菜单的上坐标(Top)
为当前鼠标位置向上一个菜单高度 
if (bottomedge < ie5menu.offsetHeight) 
ie5menu.style.top = document.body.scrollTop event.clientY - ie5menu.offsetHeight; 
else 
//否则,就定位菜单的上坐标为当前鼠标位置 
ie5menu.style.top = document.body.scrollTop event.clientY; 

//设置菜单可见 
ie5menu.style.visibility = "visible"; 
return false; 
}</pre> 
<p><pre > 
<b>function hidemenuie5() </b>{ 
//隐藏菜单 
//很简单,设置visibility为hidden就OK! 
ie5menu.style.visibility = "hidden"; 

<b>function highlightie5() </b>{ 
//高亮度鼠标经过的菜单条项目 
//如果鼠标经过的对象是menuitems,就重新设置背景色与前景色 
//event.srcElement.className表示事件来自对象的名称,必须首先判断这个值,这很重要! 
if (event.srcElement.className == "menuitems") { 
event.srcElement.style.backgroundColor = "highlight"; 
event.srcElement.style.color = "white"; 
//将链接信息显示到状态行 
//event.srcElement.url表示事件来自对象表示的链接URL 
if (display_url) 
window.status = event.srcElement.url; 


<b>function lowlightie5() </b>{ 
//恢复菜单条项目的正常显示 
if (event.srcElement.className == "menuitems") { 
event.srcElement.style.backgroundColor = ""; 
event.srcElement.style.color = "black"; 
window.status = ""; 



<b>function jumptoie5() </b>{ 
//转到新的链接位置 
if (event.srcElement.className == "menuitems") { 
//如果存在打开链接的目标窗口,就在那个窗口中打开链接 
if (event.srcElement.getAttribute("target") != null) 
window.open(event.srcElement.url, event.srcElement.getAttribute("target")); 
else 
//否则,在当前窗口打开链接 
window.location = event.srcElement.url; 


// End -- > 
< /script > 
< /HEAD > 
< BODY > 
< center >< h3 >在空白处点击鼠标右键,猜猜会看到什么 ?< /h3 >< /center >< br >< br > 
//定义菜单方框层ie5ment,并定义其显示样式以及相关的3个监测事件 
< div id="ie5menu" class="skin0" onMouseover="highlightie5()" 
onMouseout="lowlightie5()" onClick="jumptoie5();" > 

//定义其中的菜单条项目 
//根据你的需要,在这里添加其他的菜单条名称以及相应的链接URL 
< div class="menuitems" url="javascript:history.back();" >后退< /div > 
< div class="menuitems" url="javascript:history.forward();" >前进< /div > 
< hr > 
< div class="menuitems" url="http://www.chinabyte.com/builder/" >ChinaByte网络学院< /div > 
< div class="menuitems" url="http://www.chinabyte.com/column/" >ChinaByte专栏天地< /div > 
< /div > 
//页面加载后,首先执行的初始化脚本程序 
< script language="javascript1.2" > 
//如果当前浏览器是Internet Explorer,document.all就返回真 
if (document.all && window.print) { 

//选择菜单方块的显示样式 
ie5menu.className = menuskin; 

//重定向鼠标右键事件的处理过程为自定义程序showmenuie5 
document.oncontextmenu = showmenuie5; 

//重定向鼠标左键事件的处理过程为自定义程序hidemenuie5 
document.body.onclick = hidemenuie5; 

< /script > 
< /body>< /html> 
</pre> 
<P>   <b>演示效果</b></p> 
<P>   OK!看了上面代码的详细解读,你是否领会了其中的技巧?软件真是无所不能,是吗?</p> 
<P>   想要看看到底是怎样的神奇效果吗?不要犹豫,请点击<a href="http://www.chinabyte.com/builder/download/gdemo.htm" target="_blank">这里</a>!</p> 


沈阳网站建设选择我们就没错,提供全套的一条龙网站建设和沈阳seo服务,网站维护终身免费,让您最大程度上拥有成功网站优势!网站地图 快速通道

 

 
·SEO站内优化有哪些手法[2018-06-11]
·如何降低网站改版对网站的影响[2018-06-11]
·seo网站建设前需要注意的优化点[2018-06-11]
·在做网站优化时网页的标题标签太[2018-06-11]
·做SEO时需要在每个网页标题加网站[2018-06-11]
·seosem是什么意思?[2018-06-11]
·史上最齐全关键词排名下降的原因[2018-06-11]
·老站优化长尾关键词的技术分享[2018-06-11]
·网站关键词11-50名快速进入首页的[2018-06-11]
·网站关键词排名怎么去优化到百度[2018-06-11]
·目标关键词定位核心思想[2018-06-11]
·做好这三点,为关键词优化减负![2018-06-11]
·网络营销之网站优化推广难点[2018-03-01]
·网站优化中SEO关键词密度到底多少[2018-03-01]
 
  "用 诚心做好服务,用实力做好质量!   网 站地图  快速通道      电话:024-83810631   手机:13840407908
点击这里给我发消息
点击这里给我发消息