html - 位置 :absolute and scrollable div

Question

我有一个由行组成的可滚动 div。每行内部都有一个不可见的 span，当您单击该行时它会变得可见。打开时，跨度(正确地)处于行的相同高度。

但是，如果我滚动主容器，由于 span 处于固定位置，它们将不再与行处于同一高度。由于这个问题真的很难解释，here's the JSFiddle I've prepared .尝试在不滚动的情况下单击一行。重新加载页面并再次尝试，但只是在滚动到 div 到底部之后。

position:absolute 是我唯一能让跨度“弹出”该行的方法，但与此同时，它是在改变相对于该行的定位. position:relative 应该有效，但跨度比行大得多，后者使用 overflow:hidden。

请注意，该示例是使用数据绑定(bind)库创建的复杂结构的快速副本:我无法更改此结构，jQuery 甚至不是一个选项。理想情况下，我只需要使用 CSS 来解决这个问题，但我不知道如何解决:如果我滚动 div，是否可以替代 position:fixed ？

Answer 1

尝试在点击事件中使用 JS 设置 top。

$('.row').click(function () {
    var pos = $(this).position().top;
    $(this).find('span').css({
        "display": "block",
        "top":pos
    });
});

可能需要从 pos 添加/减去，具体取决于所需的确切位置。

http://jsfiddle.net/daCrosby/LM32h/8/