javascript - 从左向右滑动而不是淡化 safari css 问题

Question

我有一个滚动标题，它在 80 像素后固定并开始滚动。问题出在 safari 中，它开始滚动但从左到右开始，而不是像在其他浏览器上那样只是淡出。

<header>
  This bis the header
</header>

$(window).on('scroll', function() {
    $('header').addClass('scrolling-header');
    var offset = $(document).scrollTop();
    if (offset < 80) {
        $('header').removeClass('scrolling-header');
    }
});

.scrolling-header {
    position: fixed;
    background: #FFF;
    opacity: 0.85;
    width: 100%;
    transform: all;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
    -webkit-transform: translate3d(0,0,0);
}

fiddle

http://jsfiddle.net/uohLdwok/1/

Answer 1

发现问题，是因为需要添加-webkit-transition-property: opacity, background, position;没有 宽度，如果你说全部的话，safari 会解释每个属性。