Javascript:阻止浏览器默认右键事件,并显示定制内容

在逛一些知名图片社区的时候,遇到自己心怡的图片,想要右键另存的时候,默认的浏览器菜单不见了,却出现了如:[©kevin版权所有]之类的信息;

今天在看Javascript事件默认行为相关的知识,所以,动手实现了下类似效果:

鼠标右键的时候,会出现如下所示的内容

在线演示地址:http://codepen.io/anon/pen/xGyXVy

 

相关代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>javascript:事件默认行为</title><style type="text/css">#div1{display: none;position: absolute;padding: 6px 10px;color:#fff;border-radius: 3px;background-color: #666;}</style>
</head>
<body><div id="div1">&copy kevin版权所有</div><script type="text/javascript">//oncontextmenu:右键菜单(环境菜单)显示的时候触发,通过return false阻止默认事件var oDiv1=document.getElementById('div1');document.οncοntextmenu=function(ev){var ev=ev || event;var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;oDiv1.style.display='block';     oDiv1.style.left=ev.clientX +scrollTop+ 'px';oDiv1.style.top=ev.clientY +scrollTop+ 'px';return false;}
</script></body>
</html>

  

 

转载于:https://www.cnblogs.com/kevinCoder/p/4675509.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/296821.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Dapr + .NET 实战(十三)跨语言开发

欢迎大家参加4小时Dapr.NET 5的实战课程课程链接 https://ke.qq.com/course/4000292?tuin1271860f因为基于Dapr的服务架构是不限语言的&#xff0c;我们来看看Dapr的跨语言开发。我们使用golang&#xff0c;python&#xff0c;.NET来实现跨语言的服务调用&#xff0c;拓扑…

飞机上的排泄物都去哪里了?直接冲下来?

全世界只有3.14 % 的人关注了爆炸吧知识火车想必大家都知道&#xff0c;上完厕所&#xff0c;来也冲冲&#xff0c;去也冲冲&#xff0c;直接拥抱大地&#xff01;所以进站都会锁厕所门~那么飞机上也是这样吗&#xff1f;飞机上早期的厕所 早期&#xff0c;飞机上的马桶和普通…

.NET 基金会项目介绍 - ReactiveUI

ReactiveUI 是属于 .Net 基金会的一个项目&#xff0c;本文将简要介绍该项目相关的信息。中文介绍中文介绍内容翻译自英文介绍&#xff0c;主要采用意译、如与原文存在出入&#xff0c;请以原文为准。ReactiveUIReactiveUI 是一个可用于所有 .Net 平台的可组合的 MVVM 框架&…

史上最强悍的一张图,没有任何一个中国人能躲得开!

▲ 点击查看几乎每个家庭都会有两张地图&#xff1a;一张世界地图&#xff0c;一张中国地图。薄薄的两张纸&#xff0c;蕴藏着让每个人学会“看世界”的磅礴力量。哈佛上一任校长&#xff0c;也是300多年来唯一一位女校长德鲁吉尔平福斯特&#xff08;Drew Gilpin Faust&#x…

Dapr牵手.NET学习笔记:可观测性-分布式跟踪

分布式跟踪在dapr里是开箱即用的&#xff0c;不需要对应用作任何一丁点的侵入式编程。之前的开发&#xff0c;如果想实现分式跟踪&#xff0c;就得在应用中埋点&#xff0c;这是一个与业务无关系的动作。dpar通过sidecar可以轻松做到这点&#xff0c;从而让程序员更多精力投入到…

Android带三角形的弹窗,Android实现三角形气泡效果方式汇总

在开发过程中&#xff0c;我们可能会经常遇到这样的需求样式&#xff1a;这张图是截取京东消息通知的弹出框&#xff0c;我们可以看到右上方有个三角形的气泡效果&#xff0c;这只是其中一种&#xff0c;三角形的方向还可以是上、下、左、右。通过截图可以发现&#xff0c;气泡…

GDI+ 设置文本对齐方式

可通过以下语句来设置文本的对齐方式&#xff1a;StringFormat sF new StringFormat()sF.Alignment StringAlignment.Far; sF.LineAlignment StringAlignment.Far;代码&#xff1a;、View Code privatevoidForm1_Paint(objectsender, PaintEventArgs e) { …

微服务组件记事本:本地搭建Skywalking

最近一直在研究微服务&#xff0c;完全避免不了的是各种中间件的使用&#xff0c;打算把过程简要记录下来&#xff0c;过程很简单&#xff0c;也不会有原理和源代码级别的讲解&#xff0c;只是做下简单的知识备份。今天开始研究下链路追踪Skywalking&#xff0c;还记得之前在《…

马斯克发布脑机接口重大突破:蓝牙连接,一小时植入,已获FDA认证,人体实验在即...

全世界只有3.14 % 的人关注了爆炸吧知识综合整理自&#xff1a;机器之心、量子位、智东西编辑&#xff1a;知识君伊隆 马斯克神秘的脑机接口公司 Neuralink&#xff0c;终于向人们展示了自己首款可以「进入人体」的产品。今日&#xff0c;在 Neuralink 总部的发布会活动上&…

如何在android客户端中做到自动检查数据更新?,UpdateHelper

软件简介UpdateHelper 是一个为了简化Android App的迭代升级开发的AndroidLibrary&#xff0c;任何一个项目只要引入这个library便集成了在线检查新版本的功能以及下载APK功能&#xff0c;仅需两行代码即可搞定。UpdateHelpers要怎么使用&#xff1f;1.首先服务器端需要提供一个…

【另类见解】那些要保证缓存和数据库数据一致性的最后怎么了?

“现在如果说不出几句如何保证数据一致性方案的话&#xff0c;觉得出去面试都丢人,尤其是缓存和数据库的数据一致性“全程无图&#xff0c;请谨慎阅读缓存对于程序性能而言&#xff0c;无疑是个杀手锏&#xff0c;但不是完美的解决方案。关键在于缓存的物理位置和数据真实保存的…

3部世界顶级宇宙纪录片,献给对宇宙万物充满好奇的大人孩子~

全世界只有3.14 % 的人关注了爆炸吧知识宇宙深邃美丽&#xff0c;是黑夜的荧光&#xff0c;是夏天里冒着凉气的西瓜&#xff0c;总是诱人地勾起一代又一代人探索的欲望。对于宇宙思索与探索&#xff0c;人类的脚步从未停止。正是人类对宇宙的好奇&#xff0c;撑起了人类发展的大…

我的Java开发学习之旅------Base64的编码思想以及Java实现

Base64是一种用64个字符来表示任意二进制数据的方法。 用记事本打开exe、jpg、pdf这些文件时&#xff0c;我们都会看到一大堆乱码&#xff0c;因为二进制文件包含很多无法显示和打印的字符&#xff0c;所以&#xff0c;如果要让记事本这样的文本处理软件能处理二进制数据&#…

工业领域产品经理的尴尬处境

最近和一个1000人规模公司的智能制造部门进行交流&#xff0c;参会人员包括部门领导、技术人员、产品&#xff08;经理&#xff09;设计人员等&#xff0c;我介绍了工业信息建设相关理念、钢铁云及其他建设案例、iNeuOS工业互联网系统相关内容&#xff0c;交流期间他们领导说了…

你永远不知道女生裙子下面藏着什么

1 心不是这样比的。。2 这翻墙技巧满分3 盖了我的章你就是我的人了&#xff01;4 论道具组可以穷到什么地步5 你永远不知道女生裙子下面藏着什么6 理发店的赶紧来领你的名片&#xff0c;设计好了&#xff01;7 20190523&#xff0c;就是这样一个本质神奇的日子&#xff01;图自…

分布式/微服务必配APM系统,SkyWalking让你不迷路

前言如今分布式、微服务盛行&#xff0c;面对拆分服务比较多的系统&#xff0c;如果线上出现异常&#xff0c;需要快速定位到异常服务节点&#xff0c;假如还用传统的方式排查肯定效率是极低的&#xff0c;因为服务之间的各种通信会让定位更加繁琐&#xff1b;所以就急需一个分…

JQuery Tree 树形结构插件 zTree

zTree 是利用 JQuery 的核心代码&#xff0c;实现一套能完成大部分常用功能的 Tree 插件兼容 IE、FireFox、Chrome 等浏览器在一个页面内可同时生成多个 Tree 实例支持 JSON 数据支持一次性静态生成 和 Ajax 异步加载 两种方式支持多种事件响应及反馈支持 Tree 的节点移动、编辑…

国外的幼儿数学竟然这样出题?来测测你的孩子都会做吗?

全世界只有3.14 % 的人关注了爆炸吧知识数学很重要&#xff0c;也必须要学&#xff01;在家辅导孩子数学的家长可以在家给宝贝们换张有趣的DIY新试卷&#xff01;孩子玩累了&#xff0c;拿出来做一做&#xff0c;无形中学习数学知识&#xff0c;事半功倍&#xff01;填上对的数…

ProSolid下的遍历访问封装代码

在ProE二次开发中&#xff0c;时常需要遍历ProSolid下的面、点、轴等几何元素。我们知道&#xff0c;ProToolkit下的遍历函数还是有点小麻烦的&#xff0c;而ProWebLink中就简单很多&#xff0c;比如要遍历某ProSolid下的所有Group&#xff0c;代码如下&#xff1a; 1 var gro…

Floodlight 在 ChannelPipeline 图

我们知道&#xff0c;在Netty架构&#xff0c;一个ServerBootstrap用于生成server端的Channel的时候都须要提供一个ChannelPipelineFactory类型的參数&#xff0c;用于服务于建立连接的Channel&#xff0c;流水线处理来自某个client的请求。所以这里的 OpenflowPipelineFactory…