N
N
Nikita Shchypylov2016-07-22 17:02:46
css
Nikita Shchypylov, 2016-07-22 17:02:46

Why is background-attachment: fixed so slow in Safari?

Hello!
Problem: I have parallax on several blocks on my site. Here is the code:

<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;
}

Works decently in Firefox and Chrome, but terrible in Safari.
Question: How to solve it? What can be done so that there are no strong brakes in safari
JSFIDDLE: https://jsfiddle.net/z7b0fsx9/
Thanks

Answer the question

In order to leave comments, you need to log in

1 answer(s)
I
Ivan Korsakov, 2016-07-22
@shevchenkonik

Solution, voila: Harbahabr

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question