2

我知道 CSS 不仅支持position: fixedx同时y支持两者。

解决这个问题的常用方法似乎是结合使用固定定位与 jquery 来重新定位组件相对于非固定轴上的滚动量。这样做的缺点是组件在向这个方向滚动时会滞后很多。

我的问题是,这是否是未来 CSS 规范正在考虑的问题?有人知道吗?

我认为我们需要一个fixed-xfixed-y定位值。

现在,在两个维度上滚动更为常见的触摸设备中,这尤其成为一个问题。

这是一个小提琴:

http://jsfiddle.net/UfZPa/1/

这显示了我所追求的,但不是实际问题,因为这个非常小的例子现在看起来非常快。

更新

来自CSS ED

粘性定位元素和粘性约束矩形底部之间的交集限制了任何方向的移动,因此偏移量永远不会将粘性定位元素推到其包含块之外。但是,当页面滚动时元素在其包含块内自由移动时,它似乎被固定到相关的流根边缘,类似于固定位置元素

我认为这是在描述我想要的,但我不确定......

更新 2

为了澄清我的应用程序基本上是一个在 x 和 y 中都有滚动溢出的网格(如 Excel)。我想要的是一些标签在滚动到视野之外时沿一个方向粘在边缘,但同时在相反方向保持正常流动。我想要固定 x/flow-y 和 fixed-y/flow-x 都使用这个。问题又来了:有很多标签,这使得使用 jquery 解决方案滚动非常滞后。我认为我们缺少使组件仅在一个维度上修复并且仍然在另一个维度中流动的选项。也许我是唯一想要这个的人=)

4

1 回答 1

5

快速浏览一些 CSSWG 注释(例如这篇文章)让我相信这position: sticky可能是解决这个问题的一个潜在解决方案,前提是您只指定要修复元素的轴上的偏移量。

但是有一点需要注意:与被认为是绝对定位的固定元素不同,粘性元素相对于其包含块开始。由于相对定位的元素不会从正常流程中取出,因此您必须考虑与您的元素在同一流程中的其他元素的布局等,并且(因此?)强制元素表现得像它是固定的不管滚动位置可能有点困难。

当然,可用于验证的信息和实现太少了——我只是在做一个明智的猜测,我链接到的文档是一个 ED,不适合一般参考——但你可以随时询问www-style邮件列表,看看那里的好人怎么说。我还没有进行足够的实验,position: sticky无法自己进一步评论。

于 2013-10-21T15:40:29.287 回答