背景会流动的Banner区块

Html代码：

<div class="toptu">
    <div class="item scroll">
        <img class="scroll-image lazyloaded"
            src="https://img.ahap.cn/files/2022/01/20220201094537171.jpg"
            data-was-processed="true">
        <img class="scroll-image lazyloaded"
            src="https://img.ahap.cn/files/2022/01/20220201094537171.jpg"
            data-was-processed="true">
        <div class="sc-1wssj0-17 hVBrzU">
            <img src="https://img.ahap.cn/logo/logo.svg"
                class="lazyloaded" data-was-processed="true">
        </div>
    </div>
</div>

Css代码：

.item.scroll {
    left: 0px;
    width: 100%;
    height: 420px;
    background-size: auto 100%;
    pointer-events: none;
    background-position: center center;
    background-repeat: no-repeat;
    transition: opacity 0.3s ease 0s;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    font-size: 0;
    background: #000;
    word-wrap: break-word;
    box-sizing: border-box;
    outline: none;
}

.item.scroll .scroll-image {
    position: relative;
    height: 100%;
    transform: translateX(0px);
    animation: banner 40s linear infinite;
    opacity: 0.5;
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
}

.item img {
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}

.hVBrzU {
    position: absolute;
    top: 70px;
    left: 0px;
    right: 0px;
    text-align: center;
    font-size: 16px;
    white-space: normal;
    width: 100%;
    margin: auto;
}

.item img {
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}

.sc-1wssj0-17 img {
    width: auto;
}

    @-webkit-keyframes banner {
        from {
            -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
            transform: translateX(0);
        }

        to {
            -webkit-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            transform: translateX(-100%);
        }
    }

    @keyframes banner {
        from {
            -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
            transform: translateX(0);
        }

        to {
            -webkit-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            transform: translateX(-100%);
        }
    }