背景加透明度 字体透明度不变

<style>
#app{
    min-height:100vh;
    .header{
        min-height:12vw;position:sticky;position:-webkit-sticky;top:0;left:0;right:0;width:100vw;z-index:999;box-sizing:border-box;
        .header1{
            height:12vw;line-height:12vw;
            .iconfont{
                font-size:4.3vw;
            }
        }
    }
    .header::after {
		content: "";background:#ff3131;opacity: var(--opacity);top: 0;left: 0;bottom: 0;right: 0;position: absolute;z-index: -1;
	}
}
</style>
<div id="app" v-cloak="" >
	<!--:style="{'--opacity': opacity1,'top':`${navT}px`}"-->
	<header id="header" class="header" :style="{'--opacity': opacity1}">
		<div class="header1 space-center">
               <div class="topping flex-center" onclick="api.closeWin()">
                   <div class="iconfont iconfanhui"></div>
               </div>
               <div class="f-4-3 f-w-b">订单</div>
               <div class="topping">筛选</div>
		</div>
	</header>
</div>
<script type="text/javascript" src="../../script/vue.js"></script>
<script type="text/javascript" src="../../script/fastclick.js"></script>
<script type="text/javascript">
	//初始化fastclick方法
    window.addEventListener('load', function () {
        FastClick.attach(document.body);
    }, false);
    var vm = new Vue({
		el:'#app',
		data:{
			opacity1:0,
		},
		methods:{
			
        }
    })
</script>
<script type="text/javascript">
//document.onscroll = function(){}
window.onscroll = function() {
    scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
    if(scrollTop > vm.headerH - api.safeArea.top){
        vm.headerWidth = 53;
        vm.searchopcity = '0';
        vm.searchshow = false;
    }else{
    	if(scrollTop>=0){
	        vm.headerWidth = 93.6 - scrollTop*0.81;
    	}else{
        	vm.headerWidth = 93.6;
    	}
        vm.searchopcity = 1-scrollTop*0.02;
        vm.searchshow = true;
    }
    var typetop;
    var typenavtop = vm.headerH+api.safeArea.top;
    if(scrollTop > typenavtop){
    	typetop = vm.navT-(scrollTop-typenavtop);
    	document.querySelector('.navbox').style.cssText=`top:${typetop}px;`
    }else{
    	document.querySelector('.navbox').style.cssText=`top:${vm.navT}px;`
    }
    
	let newopcity = scrollTop/300;
	vm.opacity1 = newopcity;
}
</script>