javascript - Making the first column of a table fixed on horizontal scroll -


Thanks for reading I have a table inside a divan container (div0). The table is populated with data and is dynamically generated. Therefore, the height and width of the table is not fixed. Both the vertical and horizontal scrolls can be seen to view the entire table in the outer table. Now the requirement is that I need to correct horizontal horizontal form of the first column of the table. When scrolling the horizontal scrollbar, the first column should be fixed and the rest should be skulled. Just some indication on this, how is it necessary to get it?

I'm thinking of dividing the first column content in a div (div1) (which is not horizontal scroll), and the second scroll material is in a different divis (div2) both a line and 2 Has been placed in the table with TDS. Now I am getting 2 probes with this approach, 1 when I scroll right, div is going to divulge the scrollbar inside div0 (thinking of using a jquery scrollbut but how it is excluded from div2 ) The second is alignent between the two divs.

If I understand what you are looking for; I did not do anything like this long ago.

The HTML can look something like this

  & lt; Table range = "1" id = "header" & gt; & Lt; TR & gt; & Lt; Th & gt; & Lt; / Th & gt; & Lt; Th & gt; & Lt; / Th & gt; & Lt; / TR & gt; & Lt; / Table & gt; & Lt; Div id = "tableData" & gt; & Lt; Table range = "1" id = "table" & gt; & Lt; TD & gt; & Lt; / TD & gt; & Lt; TD & gt; & Lt; / TD & gt; & Lt; / Table & gt; & Lt; / Div & gt;   

css

  #table data {overflow: scroll; Overflow-X: Hidden; Height: 190px; Border bottom: 1 px solid # b5b3b3; Width: 940px; }   

Ensure that header table aligns with data

  $ ("# tableData"). Height (190); $ ("# TableData") width (940) (Var i = 1; i & lt; 8; i ++) {if ($ ("$ header": nth-child ("+ i.toString (++)") "). Width ()> = $ ("# Table TD: nth-child (" + i.toString (+ +) "). Width ()) $ (" # Table TD: nth-child ("+ i.toString (+ +)") ") Width ($ (" # Header th: nth-child ("+ i.toString (+ +)"). Width ()); and $ ("# Header th: nth-child (" + i. ToString () + ")"). Width ($ ("# Table TD: Enththy-Child (" + i.toString (+ +) ")"). Width ());} $ ("# TableData") Width ( Height ()) $ ("# table data") height ($ ("# table") ($ "(# table"). Width () + 20); height () & lt; = $ ("# tableData" ). Height ());   

You need to make some changes Can, but it is a solution. I'll extreme need to cover, in my example it will work for 7 column.

Comments

Popular posts from this blog

mysql - BLOB/TEXT column 'value' used in key specification without a key length -

c# - Using Vici cool Storage with monodroid -

python - referencing a variable in another function? -