html自定义鼠标右键,js自定义鼠标右键的实现原理及源码

今天来记录下js来自定义鼠标右键,同样先来分解下它的实现原理:

1、屏蔽右键默认事件;(一度我以为修改的就是默认事件)

2、对一个ul的隐藏;(这个我也曾迂腐的认为值得这样操作的都是div,汗)

3、对鼠标点击右键做出的响应,显示隐藏的ul;

4、鼠标重新点击后,ul重新被隐藏

这样来看的话,我们需要做的事情是不是就简单了很多,先上代码:

html部分

  • 开始
  • 暂停
  • 拜拜

javascript部分:

window.οnlοad=function(){

var forRight=document.getElementById("testRight");//获取对象,现在太熟悉了

forRight.style.display="none";

var title=forRight.getElementsByTagName("li");

for(var i=0;i

title[i].οnmοuseοver=function(){

this.classname="active";//其实这里我们也可以调用其他事件吧

};

title[i].οnmοuseοut=function(){//这里也是鼠标的两个事件吧

this.classname="";

};

}

document.οncοntextmenu=function(event){//这是实现的关键点

var event=event||window.event;//这个都不是问题了吧

forRight.style.display="block";

forRight.style.left=event.clientX+"px";

forRight.style.top=event.clientY+"px";//鼠标的坐标啊

return false;//这里返回false就是为了屏蔽默认事件

};

document.οnclick=function(){//就是为了更形象的模仿啊

forRight.style.display="none";

};

};

先来看今天记录的最关键的地方:document.oncontextmenu这个事件返回false的话就是屏蔽默认事件,如果我们其他都不写,只在这个事件里面写return,好像就下面这样

document.οncοntextmenu=function(){

return false;

}

这样的话,再点击右键也不会出现任何响应了。然后返回来再看整个的事件应用,好像除了这个事件,其他的都是比较熟悉的事件了,可就是对事件的这种整合总是缺乏,关键还是思路是创意吧,不过先不管哪儿多了,先整吧,但求熟读三千首,不求写来只问吟。扎马步,扎马步,扎马步.....

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

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

相关文章

计算成绩-二维数组指针(指向二维数组的指针)应用

题目: 要求自定义函数且函数的形式参数为行指针变量: 有一个10行5列的浮点型数组,用来存放10个学生5门课程的成绩,还有一个用来记录每个学生平均成绩的一维数组。要求定义函数来实现计算每个学生的平均成绩。学生各门成绩的输入和平均成绩的…

Xamarin.Forms客户端第一版

1. 功能简介1.1. 读取手机基本信息主要使用Xamarin.Essentials库获取设备基本信息,Xam.Plugin.DeviceInfo插件获取App Id,其实该插件也能获取设备基本信息。1.2. 读取手机联系人信息Android和iOS工程具体实现联系人读取服务,使用到Dependency…

[蓝桥杯2017初赛]包子凑数-模拟+巧妙枚举

题目描述 小明几乎每天早晨都会在一家包子铺吃早餐。这家包子铺有N种蒸笼,其中第i种蒸笼恰好能放Ai个包子 每种蒸笼都有非常多笼,可以认为是无限笼。 每当有顾客想买X个包子,卖包子的大叔就会选出若干笼包子来,使得这若干笼中恰好…

html中加个有颜色横线,关于html:更改下划线颜色

我在这里有此代码:echo"$username";首先,如您所见,它带有下划线()。 其次,所有文字均为红色。 那么,是否有将文本($ username)留为红色而下划线为黑的情况?因此,标签。HTML4不推荐使用…

给 EF Core 查询增加 With NoLock

给 EF Core 查询增加 With NoLockIntroEF Core 在 3.x 版本中增加了 Interceptor,使得我们可以在发生低级别数据库操作时作为 EF Core 正常运行的一部分自动调用它们。例如,打开连接、提交事务或执行命令时。所以我们可以自定义一个 Interceptor 来记录执…

LeetCode 138 复制带随机指针的链表-中等

给你一个长度为 n 的链表,每个节点包含一个额外增加的随机指针 random ,该指针可以指向链表中的任何节点或空节点。 构造这个链表的 深拷贝。 深拷贝应该正好由 n 个 全新 节点组成,其中每个新节点的值都设为其对应的原节点的值。新节点的 n…

ASP.NET Core分布式项目实战(业务介绍,架构设计,oAuth2,IdentityServer4)--学习笔记...

任务4:第一章计划与目录敏捷产品开发流程原型预览与业务介绍整体架构设计API 接口设计 / swaggerIdentity Server 4 搭建登录账号 API 实现配置中心任务5:业务介绍项目背景:基于人脉关系的金融行业项目用户:1、账号:基…

LeetCode 82 删除排序链表中的重复元素||-中等

存在一个按升序排列的链表,给你这个链表的头节点 head ,请你删除链表中所有存在数字重复情况的节点,只保留原始链表中 没有重复出现 的数字。 返回同样按升序排列的结果链表。 输入:head [1,2,3,3,4,4,5] 输出:[1,2,…

django html跳转页面跳转页面,Django html单击打开另一个html页面

我目前在使用django打开html页面时遇到了问题,尽管我已经尝试在网址.py, 视图.py,以及html页面。我的代码如下:电池电流.py在“视图”文件夹下from __future__ import absolute_importfrom __future__ import unicode_literalsfrom django.co…

你复工了吗?啥感受?

这里是Z哥的个人公众号每周五11:45 按时送达当然了,也会时不时加个餐~我的第「136」篇原创敬上感觉还没做什么事情,2020年的第一季度就结束了。相信大多数人也都已经复工了。之前进行远程公办的,大多也都回到了原先在公…

LeetCode 1669合并两个链表-中等

给你两个链表 list1 和 list2 ,它们包含的元素分别为 n 个和 m 个。 请你将 list1 中第 a 个节点到第 b 个节点删除,并将list2 接在被删除节点的位置。 下图中蓝色边和节点展示了操作后的结果: 请你返回结果链表的头指针。 输入&#xff1a…

html鼠标悬停盒子凸起,css3 transform动画鼠标悬停div容器凸起放大显示

特效描述:css3 transform动画 鼠标悬停 div容器 凸起放大显示。鼠标悬停div容器凸起放大显示效果代码结构1. HTML代码what?If you want to sell sugar water for the rest of my life or want a chance to change the worldIf you want to sell sugar water for th…

dotNET Core 3.X 使用 Web API

现在的 Web 开发大多都是前后端分离的方式,后端接口的正确使用显得尤为重要,本文讲下在 dotNET Core 3.X 下使用 Web API 。环境操作系统:MacIDE:RiderdotNET Core:3.1创建项目如果是 Windows 操作系统当然是首选 VS20…

你需要了解的 HTTP Status Code

你需要了解的 HTTP Status CodeIntro现在前后端分离的开发模式越来越流行,后端负责开发对应的 API,前端只需要 关注前端页面的数据展示和前端逻辑即可。对于前后端分离这种开发模式,我个人还是比较喜欢的,因为这样可以让更专业的人…

LeetCode 24两两交换链表中的节点-中等

给定一个链表,两两交换其中相邻的节点,并返回交换后的链表。 你不能只是单纯的改变节点内部的值,而是需要实际的进行节点交换。 输入:head [1,2,3,4] 输出:[2,1,4,3] 示例 2: 输入:head []…

2021中考高考成绩查询,2021中考

2021年浙江东阳中考查分入口暂未公布!如有最新信息,中考网会第一时间发布,请中考生和家长及时关注中考网中考考试时间频道! 编辑推荐: 2021年浙江省中考查分时间及入口汇总 2021年全国各省市中考查分时间及入2021-06-1…

今天网站都变成灰色了,这其中是怎么实现的?

“ 阅读本文大概需要 7 分钟。 ”今天是 2020 年 4 月 4 日,星期六,清明节。我们的国家经历了非常惨痛的时刻,很多英雄在救助他人的路上倒下,更有很多烈士英雄保卫人民的安危遇难,今天全国下降半旗,北京时间…

深圳市公务员考试计算机专业素养,深圳市考职位分析_公务员考试专业对照表...

2020深圳市公务员招录1069人公告已发布,报名时间:11月13日-19日16:00,报名入口:深圳市考试院专栏(http://hrss.sz.gov.cn/szksy/)或深圳市人事考试考生服务系统(以下简称考生服务系统,https://hrsstext.sz.gov.cn/ess/…

LeetCode 61旋转链表-中等

给你一个链表的头节点 head ,旋转链表,将链表每个节点向右移动 k 个位置。 输入:head [1,2,3,4,5], k 2 输出:[4,5,1,2,3] 输入:head [0,1,2], k 4 输出:[2,0,1] 提示: 链表中节点的数目在…

科个普:进程、线程、并发、并行

一、进程刘大胖打开电脑,想写点东西,于是打开WPS,突然又想和女朋友(反正我不信)聊聊天,就又打开了微信PC端,这时操作系统就会为这两个程序生成两个进程,如图:二、线程每个进程至少包含一个线程&…