如何使缩放器更新 XUL 中的项目位置？

Question

我有以下代码，其中一个按钮有四个调整器。例如，当我使用左上角的缩放器时，它的按钮从右下角收缩，而不是收缩和移动以使左上角跟随光标。我查看了 Mozilla 的文档和 Google，并尝试在 mousedown 事件处理程序上添加自定义以移动该事件 - 但无济于事。我该如何使其行为正确？

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="main" title="My App" width="300" height="300" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <script type="application/javascript" src="chrome://ades/content/main.js"/>
    <hbox>
      <stack style="padding: 0;">
        <button id="b" label="Resizable" style="margin: 0;"/>
        <resizer dir="topleft" style="background: red; -moz-appearance: none;"
                 element="b" left="0" top="0" width="5" height="5" />
        <resizer dir="topright" style="background: black; -moz-appearance: none;"
                 element="b" right="0" top="0" width="5" height="5"/>
        <resizer dir="bottomleft" style="background: black; -moz-appearance: none;"
                 element="b" left="0" bottom="0" width="5" height="5"/>
        <resizer dir="bottomright" style="background: black; -moz-appearance: none;"
                 element="b" right="0" bottom="0" width="5" height="5"/>
      </stack>
    </hbox>
</window>

Answer 1

我不知道如何实现你想要的，但如果你调整按钮的大小，它总是会在堆栈中重新定位自己（位于水平盒的开头），因此它将始终位于水平盒的开头。您可以尝试使用绝对定位，但我不确定这是否有效。