Opera下自定义右键菜单的研究

In: 前端开发

10 08 2008

Opera是一个来自挪威的浏览器,有着优秀的缓存机制,浏览网页速度很快,有着自己庞大的粉丝群。但是opera并没有支持上下文菜单事件,也就是说我们通常使用的依靠在页面中重写oncontextmenu事件来实现自定义右键菜单的方法不会工作。那么,有没有别的方法来实现自定义菜单呢?

我们来看看三个著名的产品(FckeditorYUIGoogle Doc)怎么解决opera没有oncontextmenu事件这个问题:

Fckeditor:Fckeditor这个开源的编辑器我想不用多介绍了吧,它的最新版本已经支持了opera。那么它是怎么处理右键菜单的呢?分析源码可以知道,它注册了onmousedown事件,并且判断鼠标按下的是不是右键,如果是就显示自定义菜单。这样看似很完美,但是有两个致命的弱点:1.默认情况下opera是不检测鼠标右键点击的,也就是右键按下时根本不触发mousedown事件。除非在“工具”-“首选项”-”高级”-”内容”-“Javascript选项”中勾选“允许脚本检测右键单击”;2.opera自身的上下文菜单会跟自定义菜单一起出现,也就是说无法preventDefault。这个问题解决起来有一点点巧妙,经过实验我们可以发现,opera下在type等于button的input上点击右键不会出现系统上下文菜单,于是我们可以在mousedown时在鼠标下放一个几乎透明的type=button的input,再在mouseup的时候隐藏这个button。

YUI的MENU组件:YUI是一个先进的界面库,功能强大,使用简便。那么他是怎么解决这个问题的呢?相比于FCKEditor,YUI换了另外一种思路,既然Opera默认不支持检测右键点击,那就用左键点击来代替总可以吧,但是这样显然会干扰用户正常操作,于是YUI又加了一条规则,按下ctrl键的同时点击左键才等同于右键。“Hold down the control key and click with the left mouse button.”

Google Doc:Google出品的web office套件。Google的技术不用怀疑,那么他是怎么解决这个问题的呢?答案是:既然不能完美解决,干脆就不解决。反正Google Doc的所有操作都不是只有右键菜单才能完成。不愧是Google!

本文提到的两种解决方案实现代码

再来看看这些吧

2 Responses to Opera下自定义右键菜单的研究

Avatar

operafans

02月 5th, 2009 at 3:24 am

哈哈,被骗进来了!!

Avatar

Kive

02月 14th, 2009 at 2:53 pm

路过,感谢D

Comment Form

关于我

JerryQu,当前从事前端开发,@中国北京
这里是我随便记录东西的地方~
需要找我,我的联系方式在这里 »
查找QGYWebim相关信息,请点这里 »

  • 热趣站长: 刚下了,试一下,非常感 [...]
  • 寻找白云: 效果很棒 [...]
  • avenger: 你的水平真高,这代码不得了,说实话我都有点不敢相信是国内人写的,更 [...]
  • 来无影: 这个站的模板不错,我很喜欢![:13 [...]
  • 莞尔: 我用了你的表情插件发现一个问题 那就是路径问题 我的WP没有放在根目录 [...]
  • samuel: 很棒。你自己写的demo,比去看jquery代码简单多了 [...]
  • samuel: 非常棒,很有参考价值。比去看jQuery代码舒服多了 [...]
  • 风剪云: 向你学习了。BS无德之人,拿去用也罢了。居然还拿去赚钱。[:11 [...]

共享