html 原生js 写一个表格自动滚动 鼠标放在表格上 就停止 鼠标移开 就又开始滚动 

<div id="myDiv" style="height: 200px; overflow: auto;">  <table>    <tbody>      <tr>        <td>Row 1, Column 1</td>        <td>Row 1, Column 2</td>      </tr>      <tr>        <td>Row 2, Column 1</td>        <td>Row 2, Column 2</td>      </tr>               <tr>        <td>Row 3, Column 1</td>        <td>Row 3, Column 2</td>      </tr>         <tr>        <td>Row 4, Column 1</td>        <td>Row 4, Column 2</td>      </tr>         <tr>        <td>Row 5, Column 1</td>        <td>Row 5, Column 2</td>      </tr>         <tr>        <td>Row 6, Column 1</td>        <td>Row 6, Column 2</td>      </tr>         <tr>        <td>Row 7, Column 1</td>        <td>Row 7, Column 2</td>      </tr>         <tr>        <td>Row 8, Column 1</td>        <td>Row 8, Column 2</td>      </tr>         <tr>        <td>Row 9, Column 1</td>        <td>Row 9, Column 2</td>      </tr>         <tr>        <td>Row 10, Column 1</td>        <td>Row 10, Column 2</td>      </tr>         <tr>        <td>Row 11, Column 1</td>        <td>Row 11, Column 2</td>      </tr>      <!-- ... -->    </tbody>  </table></div><style>.table-container {  height: 200px;  overflow: hidden;}table {  width: 100%;  border-collapse: collapse;}td {  padding: 10px;  border: 1px solid #ccc;}tr:nth-child(2n) {  background-color: #f9f9f9;}tr:hover {  background-color: #eee;}</style><script>var div = document.getElementById("myDiv");var scrollInterval;function startScroll() {  scrollInterval = setInterval(function() {    var table = div.querySelector("table");    var firstRow = table.rows[0];    var newRow = firstRow.cloneNode(true);    table.appendChild(newRow);    table.deleteRow(0);  }, 2000);}function stopScroll() {  clearInterval(scrollInterval);}startScroll();div.addEventListener("mouseenter", function() {  stopScroll();});div.addEventListener("mouseleave", function() {  startScroll();});</script>