IT技术精粹[JiShuBu.Com]-倾力打造一流IT技术平台!
  • 登录
  • 注册
  • 设为首页
  • 加入收藏
  • 网站首页
  • IT风向标
  • 网站优化
  • Html
  • CSS
  • JavaScript
  • ASP
  • Php/Mysql
  • Flash
  • Ajax
  • 源码下载
  • 精美桌面
  • 供求信息
  • 超稳定100M虚拟主机只要100元,还送50M邮箱!
  • 文字广告招商中...
  • 会员注册 | 用户登录 | 我要投稿
  • 信息订阅
CSS+JavaScript打造超酷右键菜单 您现在正在浏览:首页 > JavaScript > 
CSS+JavaScript打造超酷右键菜单

作者:匿名 发布时间:2008-05-26 23:33:13 来源:互联网

  但有时候我们会遇到这样的问题,我们希望禁止访问者使用右键菜单或者希望屏蔽右键菜单的某些功能,比如,为了保护网页内容我们不希望访问者通过右键菜单来查看网页源代码,也不希望其通过右键来对网页内容进行选取、复制等,

很多网页设计者在考虑这个问题的时候都是简单地对右键进行屏蔽,与其这样我们还不如用脚本来实现一个风格右键菜单,并在这个右键菜单中装上我们自己的内容。下面我们来尝试一下这个设想。

  我们首先要考虑的问题是通过鼠标右键单击事件来调用一个函数,这个函数用来显示新的右键菜单的内容。我们知道鼠标的右键单击事件是通过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中装上我们想要装的东西。通过鼠标事件调用函数来控制它的显隐,这就达到了使用鼠标右键一样的效果了。

  
【评论】【加入收藏夹】【大 中 小】【打印】【关闭】
※ 相关信息
 ·提高CSS代码的可读性  (2008-05-11 21:28:48)
 ·DIV+CSS常见错误汇总  (2008-04-29 20:54:13)
 ·CSS布局高级技巧[长风整理转载]  (2008-04-27 12:07:36)
 ·Javascript经典正则表达式  (2008-04-25 23:01:31)
 ·JavaScript经典效果集锦  (2008-04-25 22:57:40)
 ·JavaScript中运算符的优先级  (2008-04-13 22:39:46)
 ·浏览器的兼容性[CSS HACK]  (2008-04-08 18:12:09)
 ·Div CSS实例教程:分享非常不错的页面制作方法  (2008-04-06 00:22:26)
 ·DivCSS实例:让页脚保持在未满屏页面的底部  (2008-04-06 00:16:00)
 ·由浅到深了解JavaScript类  (2008-04-04 22:36:47)

发表评论
查看评论 
用户名: 密码:
验证码: 匿名发表
[注册帐号]
[控制面板]
[用户登陆]
[修改资料]
[用户收藏]
[我的状态]
[退出登陆]
 
文章搜索
     
    [添加文章]   [管理文章]
最新技术文档
    ·中国移动188号段将于1月8日起在深圳正式放号
    ·PHP与Javascript的两种交互方式
    ·使用wordpress中的函数 (PHP)
    ·js倒计时效果-精确到秒 (Javascript)
    ·PHP无刷新删除数据
    ·PHP文件系统处理类
    ·PHP文件缓存数据类
    ·PHPMailer邮件类利用smtp.163.com发送邮件方
    ·PHP的POST方式
    ·md5 结合 crypt =无敌密码
技术文档排行榜
    ·天气预报小偷,根据IP自动判断地址
    ·超经典计算机使用问题105答
    ·CSS网页布局入门教程:下拉及多级弹出式菜单
    ·'AjaxPro'未定义错误的原因&javascript顺
    ·[初学者必读]网页制作之HTML基础知识
    ·DIV&CSS打造自动伸展三栏复合布局
    ·近1000本javascript电子图书下载列表
    ·CSS 文字樣式技巧 (摘自一台湾网站,确实很
    ·阿里妈妈广告的投放技巧
    ·ajax+php无刷新二级联动下拉菜单(省市联动)
关于站点 - 广告服务 - 联系我们 - 免责声明 - 程序支持 - 网站地图 - 留言中心 - 返回顶部

Copyright © 2007-2008 www.Jishubu.com online services. All rights reserved. Template designed by laogui.
违法不良信息举报中心 津ICP备07002356号