transition页面加载触发问题解决方案

首先在body添加类名 transition_none，先禁用所有的transition过渡效果。以保证初始状态的直接渲染。

.transition_none *{
    -webkit-transition:none!important;
    -moz-transition:none!important;
    -ms-transition:none!important;
    -o-transition:none!important;
    transition:none!important;
}

下面利用window.onload 等页面加载完毕去掉 transition_none类名，保证下面正常过渡交互。

<script>
    let getBody =  document.querySelector('.transition_none');
    window.onload = function(){
         getBody.className = '';
    }    
</script>

转载自https://www.cnblogs.com/bruce-w/p/13553164.html