如何修复滞后的背景附件:在Safari中修复?

时间:2016-07-22 14:06:10

标签: javascript html css safari

麻烦:我现场有几个视差区块,其中一个是:

<section data-original="img/purity.jpg" class="special-soft lazy module parallax parallax-window_2 cf"
       id="quality">
    <div class="special-soft__text cf">
      <span class="f_left">01</span>
      <h2 class="f_left">ОСОБЛИВА М'ЯКІСТЬ</h2>
      <hr class="f_left">
      <p class="f_left">
        Особливість м'якого смаку класичної горілки Medoff досягається завдяки унікальній технології фільтрації
        «медовий дощ». Смак напою дозріває під впливом мікрочастинок меду, який вважається кращим природним
        фільтром
      </p>
    </div>
  </section>

section.special-soft {
  position: relative;
  height: 722px;
  background: url("../img/purity.jpg") no-repeat scroll center;
  background-size: cover;
  text-align: center;
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transition: background-image 0.4s;
  -moz-transition: background-image 0.4s;
  -ms-transition: background-image 0.4s;
  -o-transition: background-image 0.4s;
  transition: background-image 0.4s;
  overflow: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
}

在Firefox和Chrome中运行良好,但在Safari中我的时间滞后

问题:我该如何解决?我需要在Safari中获得更好的性能

JSFIDDLE:https://jsfiddle.net/z7b0fsx9/

谢谢你

1 个答案:

答案 0 :(得分:0)

尝试隔离导致Safari与其他浏览器之间性能差异的CSS属性。一种方法是注释掉一个或多个“section.special-soft”CSS类属性。我将从-webkit-font-smoothing属性开始。

另外,请考虑将至少一些“特殊软”CSS类属性应用于所附的div标签而不是section标签。 section标签是HTML5的新功能,但div标签存在于HTML5之前。