vue3 弹框随窗口大小实时变化

//弹框随窗口实时变化

const handleResize = () => {

  kangHei.value =  resize();

}

onMounted(() => {

  //监听事件

  window.addEventListener("resize", operateResize)

})

onUnmounted(() => {

  //移除监听事件

  window.removeEventListener('resize', operateResize);

})

util.ts

//弹框随窗口大小实时变化

export function  resize() {

  let innerheight:any = window.innerHeight;

  if(innerheight > 1500){

    innerheight = '82vh'//(innerheight+100)

  }else if(innerheight > 1100){

    innerheight = '81dvh'//(innerheight+100)

  }else if(innerheight > 1000){

    innerheight = '80.2dvh'//(innerheight+100)

  }else if(innerheight > 900){

    innerheight = '78.8vh'//(innerheight+50)

  }else if (innerheight > 800) {

    innerheight = '76.6vh'//(innerheight+10)  

  }else if(innerheight > 700){

    innerheight = '74.6vh'//innerheight-(innerheight * 0.282);

  }else if(innerheight >600){

    innerheight = '73vh'//innerheight-(innerheight * 0.31);

  }else{

    innerheight = '60vh'//innerheight-(innerheight * 0.41);

  }

  return innerheight;

}

你可能感兴趣的:(前端,javascript)