自定义右键菜单代码详解(二)
时间:2007-02-17 来源:PHP爱好者
<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>
php爱好 者站 http://www.phpfans.net php基础|php进阶|php模板.
<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>
php爱好 者站 http://www.phpfans.net php基础|php进阶|php模板.
相关阅读 更多 +