css 右键菜单边框,CSS+JavaScript打造超酷右键菜单

其实在网页上实现右键菜单的风格化已经是一个老话题了，正常情况下，网页上的右键菜单是默认IE右键选项，包括了一些常用的功能。

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

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

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

/*初始化*/

/*如果当前浏览器是Internet Explorer，document.all就返回真*/

if (document.all && window.print) {

/*选择菜单方块的显示样式*/

ie5menu.className = menuskin;

/*重定向鼠标右键事件的处理过程为自定义程序showmenuie5*/

document.oncontextmenu = showmenuie5;

/*重定向鼠标左键事件的处理过程为自定义程序hidemenuie5*/

document.body.onclick = hidemenuie5;

}

css 右键菜单边框,CSS+JavaScript打造超酷右键菜单相关推荐

VB打造超酷个性化菜单（一）
VB打造超酷个性化菜单(一) 众所周知,MS Office 2003推出已经有一段时间了,但我们依然不会忘记Office XP刚刚推出时其令人耳目一新的菜单给我们留下的深刻印象.突起的悬浮式图标,不同 ...
用Joomla!打造超酷博客（Blog）
我们这里要说的不是多用户博客,因为我认为没有必要这样做了:我们已经有了Blogger.新浪博客.搜狐博客.和讯博客--等等专业的多用户博客平台,何必自己从头建造?即使你有那么多精力.那么大服务器空间. ...
android仿优酷菜单,Android编程实现仿优酷旋转菜单效果(附demo源码)
本文实例讲述了Android编程实现仿优酷旋转菜单效果.分享给大家供大家参考,具体如下: 首先,看下效果: 不好意思,不会制作动态图片,只好上传静态的了,如果谁会,请教教我吧. 首先,看下xml文件: ...
css设置标题边框,css 如何让文字标题显示在边框上？
如图,如何让文字标题显示在边框上? <fieldset> <legend>[使用方法]</legend> </fieldset> 如果需要更精确的扩展, ...
css图片悬停边框,CSS悬停边框使内联元素稍微调整
ITMISS 您可以使用框阴影而不是边框来实现此类功能.这是有效的,因为你的阴影不会"占用DOM中的大小",因此不会影响定位,不像边框那样.尝试使用像这样的声明box-shadow ...
汉堡式折叠html,3种超酷汉堡包菜单按钮变形动画特效
这是一款使用CSS3和少量jQuery代码来完成的汉堡包菜单按钮变形动画特效.该特效使用CSS3 transition 和 transform 来完成变形动画效果,使用jQuery来触发按钮点击事件. ...
用代码打造超酷炫的粒子特效龙卷风，免费提供完整代码。
是不是很炫酷?别着急嘛,下面就是代码. <html><head> <meta charset="utf-8"> <meta name=&q ...
PS教程！教你打造超酷炫的德罗斯特效应
编者按:从前有座山,山上有座庙,庙里有个-这类可以无限循环的东西在视觉里叫德罗斯特效应,非常有意思的效果,而且简单易学,今天折葵同学这篇教程不仅有给新手的超简单3步搞定法,而且有效果更酷炫的代码进阶版 ...
html滚动菜单置顶,javascript改变position值实现菜单滚动至顶部后固定
现在很多网站都有这样的一个效果,当页面滚动到一定高度时,菜单栏会固定在页面顶部.其实就是改变 position 的值. html 代码: .wrapper{width:1000px;height:20 ...
ai的预览模式切换_绝对高级！AI打造超酷矩阵纬度文字效果！
完成效果如下在本教程中, 您将学习如何在AI中使用 "偏移路径" 选项, 以及通过 "外观" 面板方法和 "菜单栏" 方法使用它的区别. ...

css 右键菜单边框,CSS+JavaScript打造超酷右键菜单

css 右键菜单边框,CSS+JavaScript打造超酷右键菜单相关推荐

最新文章

热门文章

css 右键菜单 边框,CSS+JavaScript打造超酷右键菜单

css 右键菜单 边框,CSS+JavaScript打造超酷右键菜单相关推荐

最新文章

热门文章

css 右键菜单边框,CSS+JavaScript打造超酷右键菜单

css 右键菜单边框,CSS+JavaScript打造超酷右键菜单相关推荐