2016-07-22 116 views
0

麻煩:我在現場幾個視差塊,這裏就是其中之一:在Firefox和Chrome如何修復落後的背景附件:在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; 
} 

工作正常,但在Safari我得到滯後

問題:如何我可以解決它嗎?我需要在Safari

更好的性能

的jsfiddle:https://jsfiddle.net/z7b0fsx9/

感謝您

+0

請創建一個小提琴,以便我們可以看到問題。 –

+0

@MuhammadUsman做到了 –

回答

0

嘗試找出導致Safari和其他瀏覽器之間的性能差異的CSS屬性。一種方法是註釋掉一個或多個「section.special-soft」CSS類屬性。我會從-webkit-font-smoothing屬性開始。

另外,考慮將至少一些「特殊軟」CSS類屬性應用於封閉的div標籤而不是節標籤。 section標記是HTML5的新標記,但div標記在HTML5之前存在。