摘要:禁用鼠标右键后同样可以使用
添加css样式(添加到全局CSS文件)
a{text-decoration:none} div.usercm{background-repeat:no-repeat;background-position:center center;background-size:cover;background-color:#fff;font-size:13px!important;width:130px;-moz-box-shadow:1px 1px 3px rgba (0,0,0,.3);box-shadow:1px 1px 3px rgba(0,0,0,.3);position:absolute;display:none;z-index:10000;opacity:0.9} div.usercm ul{list-style-type:none;list-style-position:outside;margin:0px;padding:0px;display:block} div.usercm ul li{margin:0px;padding:0px;line-height:35px;border-bottom:1px solid #ccc} div.usercm ul li a{color:#666;padding:0 15px;display:block} div.usercm ul li a:hover{color:#fff;background:rgba(170,222,18,0.88)} div.usercm ul li a i{margin-right:10px} a.disabled{color:#c8c8c8!important;cursor:not-allowed} a.disabled:hover{background-color:rgba(255,11,11,0)!important} div.usercm{background:#fff !important}
添加html代码(添加到全局头部文件或底部文件)
<!-- 修改鼠标右键 --> <div class="usercm"> <ul> <li><a href="javascript:void(0);" onclick="getSelect();"> <i class="fa fa-clipboard fa-fw"></i><span>复制文字</span></a></li> <li><a href="javascript:window.location.reload();"><i class="fa fa-refresh fa-fw"></i><span>刷新页面</span></a></li> <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进一页</span></a></li> <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退一页</span></a></li> <li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="fa fa-paw fa-fw"></i><span>百度搜索</span></a></li> <li><a href="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=99249017_hao_pg&wd=%E9%94%85%E5%B7%B4%E7%BD%91%E7%BB%9C&oq=%25E9%2594%2585%25E5%25B7%25B4%25E7%25BD%2591%25E7%25BB%259C&rsv_pq=847703ec00058c65&rsv_t=c91canMcaotdU6NAq%2BofA0UL8o7vrM7CkNP02aYotlmj8LNfpuCobQVCJf2EOtDbSCc6ulbO&rqlang=cn&rsv_enter=1&inputT=2&rsv_sug3=2&rsv_sug1=2&rsv_sug7=100&rsv_sug2=0&rsv_sug4=594" rel="nofollow" target="_blank"><i class="fa fa-search"></i><span>百度优化</span></a></li> </ul> </div>
添加js代码(添加到全局js文件)
(function(a){a.extend({mouseMoveShow:function(b){var d=0,c=0,h=0,k=0,e=0,f=0;a(window).mousemove(function(g){d=a(window).width();c=a(window).height();h=g.clientX;k=g.clientY;e=g.pageX;f=g.pageY;h+a(b).width()>=d&&(e=e-a(b).width()-5);k+a(b).height()>=c&&(f=f-a(b).height()-5);a("html").on({contextmenu:function(c){3==c.which&&a(b).css({left:e,top:f}).show()},click:function(){a(b).hide()}})})},disabledContextMenu:function(){window.oncontextmenu=function(){return!1}}})})(jQuery); function getSelect() { "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? alert('啊噢...你没还没选择文字呢!') : document.execCommand("Copy") } function baiduSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? alert('啊噢...你没还没选择文字呢!') : window.open("https://www.baidu.com/s?wd=" + a) } function googleSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? alert('啊噢...你没还没选择文字呢!') : window.open("https://www.google.com/search?q=" + a) } function localSearch() { var a = window.getSelection ? window.getSelection() : document.selection.createRange().text; "" == a ? alert('啊噢...你没还没选择文字呢!') : window.open("search.php?q=" + a) } $(function() { for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) { d = !1; break } d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu()) });
说明
1、此方法需要引入jQuery 2.1.4(及以上版本)插件库
在线引入jquery-3.3.1(最新)方法
//微软压缩版引用地址 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
//官网jquery压缩版引用地址 <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
2、文末提供了一次性下载链接,包括jQuery3.3.1版
3、使用下载的代码,只需要引入就可以使用
如果你使用的是wordpress则可以在你主题目录founctions.php添加一下代码
未经允许不得转载:作者:锅巴网络,
转载或复制请以 超链接形式 并注明出处 锅巴资源。
原文地址:《js修改网页默认鼠标右键代码(美化版)》 发布于2019-03-13
超纯洁博客