javascript - Html table with fixed columns -

I am trying to decide the first 3 columns of my table so they can be shown horizontally while scrolling. But they need to be moved while scrolling vertically

What do I need to do by creating an Excel table:

I have tried

  .headcol {position: absolute; Width: 5em; Left: 0; Top: Auto; Border-right: 0 px none black; Border-top-width: 3px; Margin top: -3px;  

with the right scrollbar's jquery scrollTop so I move the top value of the yellow cells.

The current problem is that when I fill the HTML table, yellow cells are also shown from the database, although they are full.

See the next image:

This problem Any way to fix

You can use the JQUERY scroll function and move that column Which you want to "freeze" You also have to set the Z-index so that the column remains above the others.

In your CSS:

  .frezedCell {z-index: 1000; Status: Relative; }  

In your page:

  $ (document) .ready (function () {$ ("DivTableParts"). Scroll (function () {Var divTable = $ (". DivTableParts"); $ ("frezedCell"). CSS ("left", 0 + divTable.scrollLeft ());});});