发表新帖
发表新帖

background-attachment:fixed not working in chrome

后端 未结
关注
11 1915
无人及你
无人及你 2020-12-21 19:39

I am developing a website in which I have used the background-attachment:fixed property. It\'s working fine in Firefox, but the image is not fixed. In Chrome it

相关标签:
11条回答
  • 有刺的猬
    2020-12-21 19:41

    I just had a similar issue, my cover + fixed was not working and images were disappearing on chrome and was able to solve it like this:

    Crawl to higher node definitions and disable some of the CSS properties that may have conflicts, in my case for example, there was a:

    backface-visibility: hidden at the <body> level that was causing it. This was being introduced by the animate.css framework.

    Sorry its not a concrete answer but at least this provides some idea of how to debug your css code.

    0 讨论(0)
  • 南方客
    2020-12-21 19:42

    Although this is coming a bit late, by adding the css style below seems to fix it for me.

    html, body { 
-webkit-transform: translate3d(0px, 0px, 0px);
}
    0 讨论(0)
  • 谎友^
    2020-12-21 19:43

    The Above Code should work with Chrome For Windows ,

    Just try including the vendor prefix

    -webkit-background-size: cover !important;

    And give it a try

    0 讨论(0)
  • 野性不改
    2020-12-21 19:44

    bootstrap carousel was causing it for me. Adding this CSS to reverse transition properties fixed it.

    #carouselName .carousel-inner div.item.active {
  /* left: 0; */
  -webkit-transform: none;
  transform: none;
  -webkit-backface-visibility: visible;
  -webkit-font-smoothing: antialiased;
  -webkit-perspective: none;
  -webkit-transform: none;
  -webkit-transition-delay: none;
  -webkit-transition-duration: none;
  -webkit-transition-property: none;
  -webkit-transition-timing-function: none;
  backface-visibility: visible;
}
    0 讨论(0)
  • 自闭症患者
    2020-12-21 19:48

    With chrome 42, background attachment was not working for me... until I close Dev Tools.

    Hope this can save someone's time!

    0 讨论(0)
  • 广开言路
    2020-12-21 19:54

    @sabatino's answer is right, but this will destroy the background-attachment:fixed bahavior in Firefox, because they also interpret -webkit prefixed properties - for whatever reason.

    So you have to override it like this to make it work in both browsers:

    -webkit-transform: translate3d(0px, 0px, 0px);
-moz-transform: none;
    0 讨论(0)
 看不清?
提交回复
热议问题