VUE 滑鼠右鍵自定義

2022-06-24 14:12:14 字數 1121 閱讀 7000

需要在區域內右擊自定義選單的div繫結contextmenu右擊事件

}觸發rightclick方法

rightclick(mouseevent) { // 滑鼠右擊觸發事件

this.menuvisible = false; // 先把模態框關死,目的是 第二次或者第

n次右鍵滑鼠的時候 它預設的是

true

this.menuvisible = true ; // 顯示模態視窗,跳出自定義選單欄

var menu = document.queryselector('#menu');

menu.style.left = mouseevent.clientx-160 + 'px';

document.addeventlistener('click', this.foo); // 給整個

document

新增監聽滑鼠事件,點選任何位置執行

foo方法

menu.style.top = mouseevent.clienty-100 + 'px'

foo() { // 取消滑鼠監聽事件 選單欄

this.menuvisible = false;

document.removeeventlistener('click', this.foo) // 要及時關掉監聽,不關掉的是乙個坑,不信你試試,雖然前台顯示的時候沒有啥毛病,加乙個

alert

你就知道了

右鍵選單模態框

右鍵選單樣式

.menu__item {

display: block;

line-height: 20px;

text-align: center;

/*margin-top: 10px;*/

.menu {

height: 85px;

width: 90px;

position: absolute;

border-radius: 10px;

border: 1px solid #999999;

background-color: #f4f4f4;

z-index: 99999;

padding-inline-start: 0px;

這樣就可以啦。

整理 網頁自定義滑鼠右鍵選單特效

演示 js檔案 程式 選單的html var strmenu strmenu http www.yes1000.com 設為首頁 strmenu http www.yes1000.com 一想千開 加入收藏 strmenu strmenu http www.yes1000.com 首頁 strmen...

自定義 IE 滑鼠右鍵彈出式

自定義滑鼠右鍵彈出式選單 做乙個類似於window右鍵的彈出式選單。如下 var obj function loadobj o function expand else var drag 0 var move 0 function dblclick function mousemove functi...

windows新增自定義選單到滑鼠右鍵

在使用windows過程中,我們需要經常需要使用特定程式開啟某些檔案,比如使用sublime開啟乙個bat檔案並修改它,但預設sublime可能並不在滑鼠右鍵裡,這時我們可以手動新增到右鍵中。1,執行regedit,開啟登錄檔編輯器,在hkey classses root shell 下,新建項命名...