详见：
https://blog.csdn.net/HuangsTing/article/details/107766147

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            div {

                overflow: hidden;/* 必须 */
            }
            #review_box{
                height: 200px;
                border: 1px red solid;
                width:500px;
            }
        </style>
    </head>
    <body>
            <div  id="review_box" @mouseover="rollStop()" @mouseout="rollStart(60)">
                <table id="comment1">

                    <tbody >
                        <tr  height="35">
                            <td width="20" align="center">
                                <span>1</span>
                            </td>
                            <td width="80">李太白</td>
                            <td width="80">韩梅梅</td>
                            <td width="80">300</td>
                            <td >30</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>2</span>    
                            </td>
                            <td>张小雨</td>
                            <td>张三</td>
                            <td>400</td>
                            <td>40</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>3</span>
                            </td>
                            <td>李小兵</td>
                            <td>李华</td>
                            <td>250</td>
                            <td>25</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>4</span>
                            </td>
                            <td>王小虎</td>
                            <td>王磊</td>
                            <td>100</td>
                            <td>10</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>5</span>
                            </td>
                            <td>刘小星</td>
                            <td>李雷</td>
                            <td>1000</td>
                            <td>200</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>6</span>
                            </td>
                            <td>张小豪</td>
                            <td>张华</td>
                            <td>400</td>
                            <td>40</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>7</span>
                            </td>
                            <td>赵小萍</td>
                            <td>王超</td>
                            <td>600</td>
                            <td>60</td>
                        </tr>
                        <tr  height="35">
                            <td align="center">
                                <span>8</span>
                            </td>
                            <td>陈小虎</td>
                            <td>张晓</td>
                            <td>550</td>
                            <td>55</td>
                        </tr>
                    </tbody>
                </table>
                <table id="comment2"></table>
            </div>

        <script type="text/javascript">
                function roll(t){
                        var ul1 = document.getElementById("comment1");
                        var ul2 = document.getElementById("comment2");
                        var ulbox = document.getElementById("review_box");
                        ul2.innerHTML = ul1.innerHTML;
                        ulbox.scrollTop = 0;
                        this.rollStart(t);
                    }
                    function rollStart(t){
                        var ul1 = document.getElementById("comment1");
                        var ul2 = document.getElementById("comment2");
                        var ulbox = document.getElementById("review_box");
                        this.rollStop();
                        this.timer = setInterval(()=>{
                            // 当滚动高度大于列表内容高度时恢复为0
                            if (ulbox.scrollTop >= ul1.scrollHeight) {
                                ulbox.scrollTop = 0;
                            } else {
                                ulbox.scrollTop++;
                            }
                        }, t);
                    }
                    function rollStop(){
                        clearInterval(this.timer);
                    }
                roll(60);


        </script>
    </body>
</html>

原文出处：/show_1IX6x7QrSiCT.html