<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> #freezing{ width: 400px; margin: 200px auto; overflow: auto; } tr > :first-child { width: 66px; position: relative; border: solid #A4D3EE 1px; background-color: #f91; } </style> <script src="jquery-1.12.4.js"></script> </head> <body> <div id="freezing" onscroll="freezing()"> <table id="timetable"> <thead> <tr id="tablehead"> <th>dddddddddd</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> <th>2222222222</th> </tr> </thead> <tbody id="tablebody"> <td>kkkkkkkkk</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> <td>222222222222</td> </tbody> </table> </div> <script> //固定表格首列 function freezing() { $("tr>:first-child").css("left", $("#freezing").scrollLeft() - 1); } </script> </body> </html>
固定table表格首列
猜你喜欢
转载自www.cnblogs.com/miss-yang/p/10305341.html
今日推荐
周排行