
呐呐呐,闷骚的人怎么能没有一个闷骚的右键菜单呐)))
本站已采用轮盘式鼠标右键,不过感觉太花里胡哨了,在此给大家伙儿分享一个实用简洁的菜单

👈效果如图

一、添加html代码
<div class="usercm" styl<div class="usercm" style="left: 199px; top: 5px; display: none;">
<ul>
<li>
<a href="https://imashen.cn/">
<i class="iconfont icon-home">
</i>
<span>首页</span>
</a>
</li>
<li>
<a href="javascript:void(0);" onclick="getSelect();">
<i class="iconfont icon-copy">
</i>
<span>复制</span>
</a>
</li>
<li>
<a href="javascript:void(0);" onclick="baiduSearch();">
<i class="iconfont icon-Search">
</i>
<span>搜索</span>
</a>
</li>
<li>
<a href="javascript:history.go(1);">
<i class="iconfont icon-qianjin">
</i>
<span>前进</span>
</a></li>
<li>
<a href="javascript:history.go(-1);">
<i class="iconfont icon-houtui"></i>
<span>后退</span>
</a>
</li>
<li style="border-bottom:1px solid gray">
<a href="javascript:window.location.reload();">
<i class="iconfont icon-lx-refresh">
</i>
<span>刷新</span>
</a>
</li>
<li>
<a href="https://imashen.cn/links">
<i class="iconfont icon-friends">
</i>
<span>友人</span>
</a>
</li>
<li>
<a href="https://imashen.cn/guestbook">
<i class="iconfont icon-pinglun">
</i>
<span>留言</span>
</a>
</li>
<li>
<a href="https://api.imashen.cn/" target="_blank">
<i class="iconfont icon-links">
</i>
<span>API</span>
</a>
</li>
</ul>
</div>
还可能需要引入jQuery哦
如果想仅未登录和电脑端查看则用php函数包裹
底下这段代码仅限wordpress哦,其他程序也有类似的函数,小可爱们自己找找看咯~
<?php if((!is_user_logged_in())&&(!wp_is_mobile())){ ?>
//code
<?php } ?>
二、引入图标和样式
<link rel="stylesheet" href="https://at.alicdn.com/t/font_2397198_zlxtpqcjxp.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:0px 0px 15px #333;
position:absolute;
display:none;
z-index:10000;
opacity:0.9;
border-radius: 8px;
}
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;
}
div.usercm ul li a{
color:#666;
padding:0 15px;
display:block
}
div.usercm ul li a:hover{
color:#fff;
background:#7486E7
}
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;
}
//引入CSS样式
三、自定义JS函数
<script>
(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($){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())})(jQuery);function getSelect(){""==(window.getSelection?window.getSelection():document.selection.createRange().text)?toastr.info("啊噢...你没还没选择文字呢!","复制提示"):document.execCommand("Copy")}function baiduSearch(){var a=window.getSelection?window.getSelection():document.selection.createRange().text;""==a?toastr.info("啊噢...你没还没选择文字呢!","搜索提示"):window.open("https://www.baidu.com/s?wd="+a)}
</script>
然后就完工啦!
Comments | 3 条评论
感谢肾兄的转载,原文链接:https://www.szfx.top/network-tech/customize-website-right-menu.html
嘤嘤嘤,人家想要和姐姐一样的 
大佬yyds