滚动条快慢/走马灯的速度控制

根据返回显示内容的长短来控制滚动条的快慢
<div class="screen_loop animate__animated animate__flash" v-show="loopRoll">
<div :class="sdfdsf.length ||sdfds.length >70 ? 'loop_textSlow' : 'loop_text'">
  <span style="color: #f13737" v-if="rollHeightLoop">23地区: <span>{{ sdfdsds }}</span>&nbsp;&nbsp;</span>
  <span style="color: #ffc125" v-if="rollMediumLoop">12地区: <span>{{ dsfdsff }}</span>&nbsp;&nbsp;</span>
</div>
</div>
    .screen_loop {
        height: 50px;
        line-height: 50px;
        border-top: 1px solid #3d5b7e;
        border-bottom: 1px solid #3d5b7e;
        background: rgba(1, 42, 92, 0.8);
        color: #f2f402;
        font-size: 32px;
        position: absolute;
        top: 8.5%;
        left: 50%;
        transform: translateX(-50%);
        width: 55%;
        box-sizing: border-box;
        word-break: break-all;
        white-space: nowrap;
        overflow: hidden;
    }
    .loop_text {
        display: inline-block;
        padding-left: 100%;
        animation: loop 80s linear infinite;
        color: red;
    }
    .loop_textSlow {
        display: inline-block;
        padding-left: 100%;
        animation: loop 20s linear infinite;
        color: red;
    }