为什么在 Chrome 和 Opera 中单击锚链接时我的固定侧边栏消失？

Chrome 和 Opera 渲染问题：固定定位元素随着锚点点击而消失

提供的 HTML 代码尝试在右侧创建固定侧边栏- 文件的手边。然而，当

元素添加到页面后，单击锚链接时固定侧边栏可能偶尔会消失。

Chrome 解决方案：

要解决 Chrome 中的问题，请添加固定元素的样式如下：

<code class="css">#sidebar {
  -webkit-transform: translateZ(0);
}</code>

在某些情况下，Google Chrome 需要包含 3D 转换，以将重绘与其他 CSS 过程分开，有效解决显示问题。

Opera 解决方案：

修复 Opera 中的问题有点复杂。这里有一个强制连续重画的解决方案：

<code class="css">@keyframes noop {
  0%   { margin-bottom: 0; }
  100% { margin-bottom: 1em; }
}

#sidebar {
    animation: noop 1s infinite;
}</code>

这个动画会导致 Opera 不断地重新计算和重新渲染布局因子，确保固定位置保持稳定。

注意：

虽然此解决方案在大多数情况下有效解决了错误，但当 Opera 尝试重新建立固定定位时，可能会偶尔出现轻微闪烁。

以上是为什么在 Chrome 和 Opera 中单击锚链接时我的固定侧边栏消失？的详细内容。更多信息请关注PHP中文网其他相关文章！