进入新页面的动画效果

思路：主要通过js的window.onload事件监听页面的更新加载，然后获取元素后，操作dom，按照需求使用css的给其添加css样式transition属性设置页面切换效果 案例1：本案例简单演示，透明度切换

window.onload=function(){
// js的监听事件 监听页面加载
const block=document.querySelector('元素的class名字')
//获取dom元素
block.style = 'opacity:1;transition:opacity 1.3s linear;'}
设置css样式的改变  用 transition设置动画样式

.block_1 {
    height: 100vh;
 background：red；
    opacity: 0;
  }
 

好了 这样，一个页面进出透明度转换的简单动效就做出来，当然也可以用于元素的其他动态切换，不懂得小伙伴可以百度搜索transition

案例2：进入页面是某个元素缩小放大 思路：js的onload监听事件，以及css的transform:scale transition

window.onload=function(){
      const vid=document.querySelector('元素class名字')  
      fontBox.style='opacity:1;transition:opacity 1s linear;'
      vid.style='transform:scale(1);transition:all 0.4s linear;'
     
      
      }

.vid {
  width:100vw;
  height: 69.074vh;
  //下面是重点
  transform: scale(0.1);

}