我們在平常做網(wǎng)站翘紊,想自定義一下菜單和美化一下右鍵菜單蔽氨,怎么辦呢,今天來分享一下
很多網(wǎng)站如果不想別人復(fù)制網(wǎng)站內(nèi)容霞溪,會選擇屏蔽右鍵孵滞,但是這給用戶帶來了不好的體驗中捆,因此鸯匹,當(dāng)然還有更好的
美化右鍵截圖
是不是很起來美觀多了,不然點擊右鍵一動不動泄伪,影響用戶體驗殴蓬,這個還是蠻方便的,還可以百度一下蟋滴,選擇右鍵染厅,對于資源黨很方便,好了閑話話少說津函,直接上代碼
代碼
<!-- 尋代碼xundm.com自定義右鍵 --> <style type="text/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: 5px;} 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:rgba(9,145,113,0.88);border-radius: 5px} 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;} </style> <div class="usercm" style="left: 199px; top: 5px; display: none;"> <ul> <li><a ><i class="fa fa-home fa-fw"></i><span>首頁</span></a></li> <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-file fa-fw"></i><span>復(fù)制</span></a></li> <li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="fa fa-search 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 style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="fa fa-refresh fa-fw"></i><span>刷新</span></a></li> </ul></div>
好了肖粮,css代碼和HTML代碼完畢,如果有興趣? 可以在自己網(wǎng)站加上噢尔苦,完整版版本鏈接:自定義網(wǎng)站右鍵菜單