Question

我一直在为角度应用中的某个视图上的表创建一个自定义上下文菜单。这个想法是在右键单击此表中的任何特定行时显示隐藏的绝对位置div。

我认为该事件正在返回正确的clientX和clientY，但我遇到麻烦的地方是当我尝试将此隐藏的div置于右键单击的坐标时事件。我现在使用的是：

$('.toggled-options-status-change').css({
  top: event.clientX,
  left: event.clientY
}).show();

其中.toggled-options-status-change是隐藏div的类名。

基本上发生的事情是div正处于位置看似随机点，所以它不能简单地通过递减来固定，其中顶部和左侧位置是常数值。

我很难分辨出发生了什么，我希望我可以与你们分享小提琴或其他东西。我希望有人之前遇到过这样的问题并知道进一步调查的方向。

修改 - CSS

.toggled-options-status-change {
  position: absolute;
  display: none;
}

.off-canvas-wrap {
  -webkit-backface-visibility: hidden;
  position: relative;
  width: 100%;
  overflow: hidden;

.inner-wrap {
  -webkit-backface-visibility: hidden;
  position: relative;
  width: 100%;
  -webkit-transition: -webkit-transform 500ms ease;
  -moz-transition: -moz-transform 500ms ease;
  -ms-transition: -ms-transform 500ms ease;
  -o-transition: -o-transform 500ms ease;
  transition: transform 500ms ease;
}

修改 - HTML

相关的html大纲：

<html>
  <body>
    <div class="off-canvas-wrap">
      <div class="inner-wrap">
        <div ng-view>
          ...
        </div>
      </div>
    </div>
  </body>
</html>

Answer 1

几乎总是有这些事情，至少对我来说，答案非常简单，让我看起来像个傻瓜第一次错过它。哦，无论如何都很好。

top应该是clientY，而不是clientX，反之亦然。 omg

如何在Angular App中制作自定义上下文菜单？

1 个答案: