In my web application for iPad using Angular JS, HTML5, and CSS3, I'm facing a challenge with a large table that requires both horizontal and vertical scrolling, along with a "freeze-pane" feature similar to MS Excel.
Currently, I've divided the table into three parts - top, left, and middle regions using a div-based layout, as illustrated in the image. I'm tracking scroll events on the scrollable regions (top and left) and then adjusting the position of the middle region accordingly using Javascript. While this solution works, it does feel somewhat choppy. I'm wondering if there's a smoother way to achieve this functionality. I prefer not to use plugins to avoid adding more weight to my code, but I'm open to lightweight and efficient plugin suggestions if they exist.
Thanks in advance!