网络软件系统工具应用软件图形图像多媒体类免费游戏安全相关免费音乐网页素材 电子书籍考试考题建站源码
教育教学多媒体类编程开发操作系统游戏天地娱乐天地简历求职站长专区网页设计安全技术图形图像文学驿站
业界资讯 | 图形图像 | 操作系统 | 网络冲浪 | 工具软件 | 办公软件 | 媒体动画 | 精文荟萃 | 认证考试 | 网页设计 | 技术开发 | 专栏
当前位置:热点网络学院技术开发ScriptJavaScriptCSS+JavaScript打造超酷右键菜单
精品推荐
热点TOP10
·JavaScript实现页面之间传递参数的方法
·你是否理解JavaScript的执行顺序?
·长文章分页显示思路及页码条显示新思路
·点击复制页面地址送朋友
·适合本blog的一个精美javascript日历
·如何实现一个表格表头不动tbody区域用滚动条可以滚动
·Iframe的隐藏和显示
·显示客户端页面执行时间的代码
·JavaScript实现页面之间传递参数的方法
·CSS+JavaScript打造超酷右键菜单
·Javascript脚本实现静态网页加密
·长文章分页显示思路及页码条显示新思路
·asp下闰年计算方法
·用JavaScript脚本将当地时间转换成其它时区
·Javascript获取地址参数
·Javascript实例:Select的OnChange()事件
·一個Ajax.NET的查詢實例
·获取cpu序列号,硬盘ID,网卡MAC地址
·javascript 操作 ListBox 的问题
·同时对多个文件进行大量写操作对性能优化
CSS+JavaScript打造超酷右键菜单
日期:2006年10月9日 作者: 查看:[大字体 中字体 小字体]

  但有时候我们会遇到这样的问题,我们希望禁止访问者使用右键菜单或者希望屏蔽右键菜单的某些功能,比如,为了保护网页内容我们不希望访问者通过右键菜单来查看网页源代码,也不希望其通过右键来对网页内容进行选取、复制等,很多网页设计者在考虑这个问题的时候都是简单地对右键进行屏蔽,与其这样我们还不如用脚本来实现一个风格右键菜单,并在这个右键菜单中装上我们自己的内容。下面我们来尝试一下这个设想。

  我们首先要考虑的问题是通过鼠标右键单击事件来调用一个函数,这个函数用来显示新的右键菜单的内容。我们知道鼠标的右键单击事件是通过document.oncontextmenu来调用的,如果我们自行定义document.oncontextmenu=某个函数,这样就可以实现新右键菜单的调用了,关键问题是如何通过这个函数来控制菜单的显示,同时,还要通过窗体的单击事件document.body.onclick(一般指左键单击)来隐藏菜单,这样一个过程就完成了鼠标右键菜单的弹出和隐藏。

  首先来看看这段脚本代码:

/*初始化*/
<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>

  一般情况下页面装载完毕后才发生鼠标右键事件,所以为了不影响页面的装载速度我们可以把这段代码放在页面的最后面。这段代码很简单,首先检验是不是IE浏览器,如果是那么下面的定义就应该有效。也就是说当检查到客户端使用的浏览器是IE的时候那么当用户产生右键事件时就调用函数showmenuie5,当用户产生左键事件时就调用函数hidemenuie5。

  解决了上面这个问题,现在我们要考虑如何通过函数showmenuie5和函数hidemenuie5来实现菜单的显示和隐藏。当然,这里的菜单并不是真正意义的右键菜单,而是我们自己做的一个div,在这个div中装上我们想要装的东西。通过鼠标事件调用函数来控制它的显隐,这就达到了使用鼠标右键一样的效果了。

(出处:http://www.vipcn.com

关于我们 | 帮助(?) | 版权声明 | 友情连接 
Copyright 2005-2005 viphot.com All Rights Reserved.
Powered by:mesky