0

我正在使用 Slickgrid 并试图实现下面的视觉效果。

蓝点可以是任何图标/按钮。

在此处输入图像描述

关键问题是如何创建一个始终以所选单元格为中心的浮动 DIV... 或一个 3x3 表格,其中心单元格是所选单元格。

关于如何开始的任何建议?

非常感谢!

PS我试图通过两种方式解决这个问题:

1) 自定义格式化程序

function styleFormatter(row, cell, value, columnDef, dataContext) {

    var button = "<button class='button' title='Manage comments'></button>";


    if (value == null || value === "") {

        return "";

    } else {
            return "<div class='classValueFormat'><div class='divButton'>" + button + "</span>" + value + "</div>";
        }

    }
}

divButton 的 CSS 将 margin-top 设置为负值,试图将其推出单元格边框。这里的问题是边距将单元格的主要内容向下或向上推,因此无法看到。我认为自定义格式化程序是不可行的,因为它强制任何内容都在单元格边界内。

2) 按照 Santiago 的建议和 Michael 在上下文菜单示例中演示的那样获取 x 和 y 位置是一个想法,但我放弃了,因为我无法触发 DIV 出现在导航上,也因为它没有随单元格调整大小或移动滚动页面时使用单元格。

4

3 回答 3

1

单独创建覆盖 DIV 并将其附加到文档正文。然后,监听onActiveCellPositionChanged事件并使用getActiveCellPosition重新定位覆盖。

于 2012-08-07T18:45:14.653 回答
0

我没有尝试过,这听起来可能违反直觉,但也许您可以使用编辑器而不是格式化程序。编辑器实际上不会编辑数据,但可以在单元格位置上方呈现您需要的 HTML。您必须在编辑器中处理导航,但我认为这是可行的。请参见示例 3,尤其是描述字段编辑器(它在页面滚动时移动)。

于 2012-08-07T17:27:41.057 回答
0

您能否获取鼠标位置并将此值发送到 div 的 position-x 和 position-y.css()或类似的东西?

再想一想:我想你需要使用的是.focus() 函数

于 2012-08-07T08:25:08.890 回答