通过拖动文本区域来拖动面板 firefox sdk

drag panel by dragging textarea firefox sdk

所以我创建了一个带有 javascript 的面板用于 firefox 扩展,如下所述:

var win = Services.wm.getMostRecentWindow('navigator:browser');
var panel = win.document.createElement('panel');
var screen = Services.appShell.hiddenDOMWindow.screen;
var props = {
   noautohide: true,
   noautofocus: false,
   backdrag: true,
   level: 'top',
   style: 'padding:10px; margin:0; width:530px; height:90px; background-color:rgba(0,0,0,0.3); border:none;'
}
for (var p in props) {
   panel.setAttribute(p, props[p]);
} 

var textarea = win.document.createElement('textarea')
textarea.disabled = true;
textarea.readonly = true;
textarea.overflow = 'hidden';
textarea.width = '525px';
textarea.height = '85px';
textarea.style.textAlign = 'center';
textarea.style.fontFamily = '"New Century Schoolbook"';
textarea.style.color = 'white';
textarea.style.fontSize = '21px';
textarea.style.fontWeight = 'bold';
textarea.style.fontStretch = 'semi-condensed';
textarea.style.backgroundColor = 'rgba(0,0,0,0)';


panel.appendChild(textarea);
textarea.innerHTML = 'text';

win.document.querySelector('#mainPopupSet').appendChild(panel);

panel.addEventListener('dblclick', function () {
   panel.parentNode.removeChild(panel)
}, false);

panel.openPopup(null, 'overlap', screen.availLeft+screen.width/2, screen.availTop/2);

所以它只是一个面板,里面有一个文本区域。我的问题如下:我可以通过选择边框并四处移动来拖动面板,但是由于文本区域,我无法通过拖动文本区域来拖动面板。

我想要的是关闭拖动事件并将其传递给面板的文本区域。我如何让用户拖动面板而不是文本区域?

我在指针事件中找到了答案css 属性:

textarea.style.pointerEvents = 'none';

更多信息:https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events