从左向右滑动，而不是褪色的safari css问题

Sliding from left to right instead of fading safari css issue

本文关键字：褪色 safari 问题 css      更新时间：2023-09-26

我有一个滚动标题，在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/

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

相关文章：