固定附件背景图像在与 css 转换结合使用时在 chrome 中闪烁/消失 [英] Fixed attachment background image flicker/disappear in chrome when coupled with a css transform

问题描述

我目前正在做一个视差网站主题.背景图像需要固定为某些'div'和'section'附加，以避免jquery沉迷于所有内容.问题是任何动画项目下方的标签的背景图像在转换完成时都会消失，仅在 Google Chrome 上.补救措施?

I am currently doing a parallax website theme. The background images need to be attached as fixed for certain 'div's and 'section's to avoid jquery indulging in everything. The problem was the background images of the tags below any animated item disappeared while the transformation is being done, only on Google Chrome. Remedy?

推荐答案

这是一个非常普遍的未解之谜.最近我遇到了同样的问题，并且-webkit-backface-visibility: hidden"被证明是没用的(在我的固定"附加背景上)，因为背景在设置时就消失了.(附加信息:原因是当背景设置为固定时，几乎类似于在背景中放置一个固定的'div'并将原来的div背景设置为透明.隐藏的背面很明显).

This has been a very common unsolved mystery. Recently I had the same problem, and '-webkit-backface-visibility: hidden', proved to be less than useless (on my 'fixed' attached background), since the background just disappeared when it was set. (Additional Info: the reason is that when the background is set as fixed, it is almost similar to putting a fixed 'div' in the background and setting the original div background to be transparent. Hidden backface does the obvious).

要解决当前的问题，请尝试将元素的 'position' 属性设置为 'static'，或者如果您已赋予它一些其他值，即 'relative'、'fixed' 或 'absolute'，只需删除它们即可.

To solve the current problem, try setting the 'position' propery of the element as 'static', or if you have given it some other value, namely 'relative', 'fixed' or 'absolute', just remove those.

如果你不记得设置了position属性，问题依旧存在，我的建议是你使用chrome或者firefox上的调试工具，来

If you don't remember setting the position property, and the problem still persist, my suggestion is that you use a debugging tool on chrome or firefox, to

确保位置"属性没有手动设置值，除了'静态'.

只花了半个小时搜索...认为这可以让您更轻松...问候.:)

Just spent half an hour searching... Thought this could make it easier for you... regards. :)

这篇关于固定附件背景图像在与 css 转换结合使用时在 chrome 中闪烁/消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！