隐藏详细信息自动滚动到隐藏部分的末尾

大家好,

我注意到一个奇怪的行为:当主题中最新的帖子包含一些“隐藏详情”文本或图片时,点击它会直接跳转到隐藏详情的最后一行。当主题中出现新帖子时,此行为会发生变化,并按预期工作——它会展开文本,并且您会停留在顶部,与您第一次展开它、返回、隐藏它并再次查看时相同。

不知道这是否是预期的行为,但找不到任何可以确认的信息。任何有助于确认这是否是 bug 的帮助都将不胜感激。

已在 Android 上的 Chrome 和 Firefox、Linux 上的 Chrome 上进行了测试,所有设备上的行为均相同。

@TomoftheFog 我还没看,但你能否发布一个带有此问题的原始帖子内容示例?这将有助于我们深入研究此问题。谢谢。

2 个赞

这与 Details expanding from bottom when at the end of a topic 报告的是同一个问题吗?

4 个赞

是的,没错。我查看了一下,没有发现相关主题,所以才发了一个新帖子。

我发现这个问题出现在文本中包含图片的情况下。在我们的论坛上,用户是在这个特定帖子中提出来的:

我尝试过使用 /raw/xxxxx,但它无法显示原始帖子内容,因此我从数据探索器中复制了原始内容并贴在这里。内容超过 80,000 个字符,不确定这是否会影响显示,但同样的问题也出现在小得多的帖子上。

感谢您对此事的回复。

[details=“来自数据探索器的原始帖子内容”]
假期让我忙得不可开交,但现在圣诞节已过,我又回到正轨。接下来是 Razor Ridge!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)001 [details=“Kiki 游玩 Dixie Kong’s Double Trouble,第 6 部分”] 从 Buzzer Barrage 开始,这是我们的第一个洞穴关卡。如果你还没学会,现在就是被迫学习如何投掷 Kong 的时候了。我第一次玩的时候竟然完全错过了这一点,直到我开始乱按按钮才过关,你能相信吗?Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)003 Quawks 再次登场,带来更多关于桶的恶作剧,其中有一些很棒的片段,需要你以特定方式滚动它们。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)005 DonkeyDonkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)003|571x500 Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)008 这是我们第一次遇到 Kopter 敌人,由于它们不停地旋转和移动,你很难看清它们的样子,所以它们对我来说总是看起来很怪异。我的大脑根本无法想象它们在运动中到底是什么样子。结果发现它们只是瘦小的爬行动物,戴着曲棍球头盔,双手举着螺旋桨叶片。真奇怪!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)009 Kopter 对我们的攻击免疫,并且会从侧面伤害我们,所以通常最好的选择是远离它们。然而,在关卡末尾,我们需要违背自己的判断,在这个垂直隧道中高高弹跳,以获得一个奖励桶。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)011 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)012 这个奖励房间甚至围绕着这种间接推进方式旋转(双关语)!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)013 必不可少的 Wrinkly Kong 拜访。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)015 自从上次以来,我们已经收集了不少物品盒。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)016 是时候去拜访 Benny 了,正如 @Obskyr 已经指出的那样,他和他的兄弟 Björn 是以瑞典乐队 ABBA 的两名成员命名的。如果你继续和他交谈,他会说“take a chance on me”,这是对其中一首歌曲的致敬。虽然对瑞典音乐家的致敬非常明显,但我完全不明白为什么他们被 blatantly 设定为蒂罗尔人。英国人真的把瑞典和瑞士搞混了吗?还是他们故意开了一个高级的双重玩笑?很难说。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)017 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)018 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)049 Benny 让我们免费使用他的滑雪缆车!你可能会想他应该会想要一些熊币来维持生意,但我没有抱怨。Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)022 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)023 轮到 Kong-Fused Cliffs 了,这是游戏中最令人难忘的关卡之一。前提既荒谬又简单:你在攀爬一根永远燃烧的绳子。小心,否则会被烧伤。哎哟!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)025 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)028 屏幕右侧边缘的这根香蕉完全骗过了我。我拼命往那边冲,差点被屏幕底部吞噬,但经过一番 frantic 跳跃,我在最后一秒到达了奖励桶。呼!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)030 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)031 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)032 如果你在到达这个阳台时还没有两个 Kong,千万不要跳下去!继续攀爬,然后向左跳以获得一个桶。在保持站在柱子上的同时将其向右投掷,以击倒下方洞穴入口处的 Koin。如果没有后备力量将你抛上去,你只有一次机会利用燃烧的绳子,所以要准备好!Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)034 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)035 Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)036 这样我们就可以访问第二个滑雪缆车,由 Björn 操作。有趣的事实:Björn 在瑞典语中是“熊”的意思,所以他的全名 Björn Bear 字面意思就是“熊熊”。我很难判断他的口音,我们瑞典人说的英语确实很奇怪,但我们肯定不会说“我正在 Björn

我在 Details expanding from bottom when at the end of a topic 无法复现该问题,但在上一条帖子中确实看到了。该主题的实际原始内容位于 https://forums.insertcredit.com/raw/4248/90,如下所示。我想当隐藏文本非常长时,这个问题最为明显?

假期让我忙得不可开交,但现在圣诞节已过,又要回归正题了。接下来是 Razor Ridge!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)001|571x500](upload://tU79S4id5SHH5jN3vkvLEq0BdwJ.png)

[details="Kiki 游玩《大金刚国度 3:迪迪刚的双重麻烦!》第 6 部分"]
从 Buzzer Barrage 开始,我们的第一个洞穴关卡。如果你还没试过,现在就是被迫学会投掷金刚的时候了。我的第一次通关竟然完全错过了这一点,一直卡在这里,直到我开始乱按按钮,你信吗?
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)003|571x500](upload://ouD1aOhzMXzaz2SCWvoXI7cpYQp.png)

Quawks 再次回归,带来更多精彩的桶子把戏,其中有一些很酷的小片段,需要你以特定方式滚动它们。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)005|571x500](upload://xP42dOyr5X0aasVLrLtqkg4K2K6.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)008|571x500](upload://a9MFWoIgi38TYsnRzHn9YM001ez.png)

这是我们第一次遭遇 Kopter 敌人,由于它们不停地旋转和移动,你根本看不清它们的样子,所以对我来说它们看起来总是很怪异。我的大脑完全无法想象它们在运动时到底是什么样子。结果发现,它们只是几只瘦小的爬行动物,戴着冰球头盔,双手举着旋翼叶片。真奇怪!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)009|571x500](upload://uLRQl0nldVXzZduYGecnuDKtlLI.png)

Kopter 对我们的攻击免疫,并从侧面伤害我们,所以通常最好的选择是远离它们。然而,在关卡末尾,我们需要违背自己的判断,跳上这只 Kopter,沿着垂直通道向上弹跳很远,以获取奖励桶。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)011|571x500](upload://leUDRxslTtAPYdHdLQwHnfHxH2D.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)012|571x500](upload://9qsMfb5XT8oYDGN3nvhPxC182PK.png)

这个奖励房间甚至围绕着这种间接推进方式展开(双关语)!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)013|571x500](upload://9tExOD8g2TR5Iuq2lWFRyyVJ8AX.png)

例行公事,拜访 Wrinkly Kong。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)015|571x500](upload://b7t1JUYAbsun2kZ6qBQXrkxyvvF.png)

自从上次以来,我们已经收集了不少道具盒。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)016|571x500](upload://VcTwOnM3nhfBBOpQTp91H4z756.png)

是时候去拜访 Benny 了,正如 @Obskyr 已经指出的那样,他和他的兄弟 Björn 是以瑞典乐队 ABBA 的两位成员命名的。如果你继续和他对话,他会说“给我一次机会吧”(take a chance on me),这是对他们其中一首歌曲的致敬。虽然对瑞典音乐人的致敬非常明显,但我完全不明白为什么他们公然打扮成蒂罗尔人。英国人真的把瑞典和瑞士搞混了吗?还是他们故意开了一个高级的双重玩笑?很难说。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)017|571x500](upload://wqAatNacwiwVRhqf0k6YOd3xRBc.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)018|571x500](upload://f4Dc9tL9MJ82w5eyr9mYqAIkgLB.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)049|571x500](upload://mPiPdYGYc5igb5TqxCLA89rIJ9Z.png)

Benny 让我们免费使用他的滑雪缆车!你可能会想他应该收一些熊币来维持生意,但我可没有抱怨。
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)022|571x500](upload://eY1JoIQDQnWrEOsndtDg1uhBgWA.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)023|571x500](upload://ndtAcU4SwpHdI4RDoWPIuAliaH.png)

轮到 Kong-Fused Cliffs 了,这是游戏中最令人难忘的关卡之一。设定既荒谬又简单:你正在攀爬一根永远燃烧的绳子。小心,否则会被烧伤。哎哟!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)025|571x500](upload://lI4vD88VJh7hK6b0G1oAM6VBSEr.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)028|571x500](upload://yqApEACiK3lA77D5m8ZdVIGLaSS.png)

屏幕右侧边缘的这根香蕉完全骗过了我。我果断地转向那边,差点被屏幕底部吞噬,但经过一番 frantic 跳跃,我在最后一秒成功到达了奖励桶。呼!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)030|571x500](upload://uJ0TFrYVfqWAtkz92YIYjQ82ShK.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)031|571x500](upload://wWshMqP3mKQobKzeUvMyWQ6eDPS.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)032|571x500](upload://1zxONVq9L9oi9ez2nKCXJaSrzk2.png)

如果你在到达这个阳台时还没有两个金刚,千万不要跳下去!继续攀爬,然后向左跳以获得一个桶子。在保持在柱子上的同时,将其向右投掷,击倒下方洞穴入口处的 Koin。如果没有同伴把你抛上去,你只有唯一一次机会利用燃烧的绳子,所以要准备好!
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)034|571x500](upload://9beHYCvyKvmi6d4bGXAVNyQKfC6.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)035|571x500](upload://sxoBzZI6NHgNAg0FLknPrEQ8C1a.png)
![Donkey Kong Country 3 - Dixie Kong's Double Trouble! (USA) (En,Fr)036|571x500](upload://bH5Vhw7pxgnZOdJpHmQR3xFGHKt.png)

这样我们就可以访问第二个滑雪缆车,由 Björn 操作。有趣的事实是,Björn 在瑞典语中是“熊”的意思,所以他的全名 Björn Bear 字面意思就是“熊熊”。我很难判断他的口音,我们瑞典人说的英语确实有点怪,但我们肯定不会说“我正在被 Björn
2 个赞

感谢您提供原始更新,我以后一定会使用它。

长度不是我测试时的因素。我尝试了更短的帖子,发现同样的问题出现了。唯一真正突出的问题是,当带有隐藏文本的帖子是主题中的最新帖子时,似乎确实会发生这种情况。一旦发布了回复,它就可以正常工作。

例如,您上面的帖子现在可以正常工作,但在您的帖子之前,它会直接跳到帖子的末尾。

1 个赞

我能 :raising_hand_woman:。我认为这取决于浏览器窗口的大小,因为它受到我滚动位置的影响。

5 个赞

我发现同样的事情发生了,但大多数时候,无论框在哪个窗口中处于什么位置,它都会恢复到文本的末尾。

这实际上是“隐藏详细信息”框的行为方式,而不是一个错误吗?

1 个赞

这种误行为在不同浏览器上是否一致?感觉我们有一个事件冒泡到了不该出现的地方。

3 个赞

我认为是的。我可以在 Edge 中重现此问题,如上所示,在 Firefox 中也可以:

我还注意到,这次它发生在时间线最终固定到主题末尾之前。

3 个赞

是的,我在 Chrome 和 Firefox 上都找到了,分别使用了 Android 和 Linux,其他论坛用户也在其他操作系统上报告了同样的问题。

3 篇帖子已拆分为新主题:无法在没有手动输入的情况下选择文本

如果能在 DOM 中交换 row(帖子)和 topic-navigation(时间线)的位置就好了。现在它是反向的,并且使用 CSS 网格将其放置在正确的位置。我认为这会导致问题。问题仅发生在 924px 以下,当列排列在一起并且靠近底部时。但这可能是不可能的,这就是为什么它被反向排列的原因。

3 个赞

@david / @jordan.vidrine 想法,我们应该交换 DOM 吗? 我猜缺点是如果我们交换它可能会破坏很多东西。

1 个赞

这是因为 Chrome 和 Firefox 中的滚动锚定(Safari 即将推出)。此功能使浏览器将自身“锚定”到可见元素,从而在视口上方插入内容不会导致滚动位置发生变化。

Firefox 具有此功能的调试模式,可以通过访问 about:config 并切换 layout.css.scroll-anchoring.highlight 来启用。所以,是的,我们可以看到它通常会锚定在帖子流中的某个元素上:

但是,如果你在时间线折叠时向下滚动得太远,那么时间线就会被选作锚定点:

正如 @don 所说,这是因为 DOM 中元素的顺序与显示的顺序不同。似乎滚动锚定算法按顺序遍历 DOM,并选择它能找到的第一个完全在视口中的元素。因此,如果折叠的时间线在视图中,它将始终在帖子内容之前被选中。

更改顺序会有所帮助,但是的,我担心可能出现回归。另外,我想知道它是否出于某种原因(可能是屏幕阅读器?)是这样排列的。

最简单的解决方法是将时间线上的 overflow-anchor 设置为 none。这样,它就不会被选作锚定:

8 个赞