小程序css特效

这里有两个特效，如何把图片变成水波浪一样在跳动着

.wave-bg {

    z-index: 1;

    animation: wave-bg 10.25s linear infinite;

}

@keyframes wave {

    from {

        transform: translate3d(125rpx, 0, 0);

    }

    to {

        transform: translate3d(1125rpx, 0, 0);

    }

}

.wave { position: absolute; z-index: 3; right: 0; bottom: 0; opacity: 0.725; height: 260rpx; width: 2250rpx; animation: wave 10s linear infinite;}

@keyframes wave { from { transform: translate3d(125rpx, 0, 0); } to { transform: translate3d(1125rpx, 0, 0); }}

<view class="hd" > <image class="logo" src="/image/wtzs.png" mode="widthFix"></image> <image class="wave" src="/image/wave.png" mode="aspectFill"></image> <image class="wave wave-bg" src="/image/wave.png" mode="aspectFill"></image> </view>