实现效果

图片以Y轴进行上下浮动

实现代码

<template><view class="header"><view class="image-center"><image src="../../static/image/index_center.png" class="centers"></image></view></view></template><script setup></script><style lang="scss" scoped>.header {.image-center {width: 600rpx;height: 400rpx;.centers {width: 100%;height: 100%;animation: float 4s ease-in-out infinite;/* 控制动画的速度、时间、迭代次数等 */}@keyframes float {0% {transform: translateY(0);}50% {transform: translateY(-40rpx);}100% {transform: translateY(0);}}}}
</style>