为什么在 Firefox 中输入文本区域会导致屏幕滚动？

Question

我只在 Firefox 中遇到了一个非常奇怪的同位素插件问题。我的每个同位素元素都有一个文本区域，当我向下滚动到底部并输入其中一个文本区域时，屏幕会跳到顶部。我已经在 jsfiddle 中复制了这个：

http://jsfiddle.net/galtschul/WfTZ5/

我已经看了好几个小时了，甚至无法弄清楚是什么导致了这个卷轴被触发。希望得到一些帮助！

Answer 1

所以，问题不在于同位素。问题是在 scale3d 和/或 transform3d 发生后 firefox 如何渲染文本区域存在错误。它最终“认为” textarea 在左上角，这就是它跳到顶部的原因。以下是 Mozilla 的 bugzilla 上提交的两个错误：

2011 年 11 月：https://bugzilla.mozilla.org/show_bug.cgi?id=703241 2012 年 7 月：https://bugzilla.mozilla.org/show_bug.cgi?id=778761

在应用相同的转换后，Chrome 也会出现渲染问题。即，插入符号的渲染。我提交了一个新的但在 Webkit 的 bugzilla 上，很快就得到了 Webkit 开发人员的确认。

这是一个错误示例：http://jsfiddle.net/galtschul/StbKg/

在单击按钮之前单击任何可编辑框并查看插入符号是否正确呈现。然后单击按钮，这将缩放文本区域并观察光标不闪烁......输入几个字符，然后向左箭头观察插入符号没有移动......然后再次输入观察字符被插入到预期的位置。

这是错误报告：https://bugs.webkit.org/show_bug.cgi?id=94985

急切地等待修复！！

Answer 2

正如我所观察到的，这是由于 .isotope-item { position :absolute} 属性。 尝试了很多，但真的无法找出解决方案。