lorenzofox3 / lrstickyheader Goto Github PK

I added the directive on a table with 2 header rows, one for titles, the other for st-search filters, and only the filters stay stuck on scroll..

Hello Laurent,

I have an issue with lrStickyHeader/stStickyHeader when the table size is a little bit bigger than the size of the viewport.
When the sticky header appears, it is removed, making the page scroll up again.

See http://run.plnkr.co/M9d8ptMcl3ivpJLZ/ with a viewport size of 800x600 and scroll to the bottom of the page to see the undesired effect.

Regards,
cmorgant.

The lrStickyHeader library does not work when the table is inside a container with a fixed height and overflow:auto; where the table fills the entire height of the container height (dynamically).

See your adjusted example: https://jsfiddle.net/361vw6c3/

I would expect it to work in the same way as the CSS approach, where you can have something fix above the table.
https://plnkr.co/edit/3oyuGZgPmLlaFSly41au?p=preview

Works great, but we need the enhancement from PR #5 (as we also use a sticky nav-bar). The NPM-package is ~4 month old and does not contain the headerHeight option. Would it be possible to release a new minor version?

Hi,

I've lot of variety of tables where I'm using lrStickyHeader.js library. For simple tables it works fine without any flaws. But for large, complex tables with multiple column spans and rowspans the sticky header warped when I scroll down, or sometimes the table beneath the header shrinks down.

The shrinking down of the table can be fixed by adding the table style width: 99% !important;. But the sticky headers columns are not aligned with the table down below. When I scroll down it becomes misaligned with the table beneath it. I've added screenshots of the issue.

Please note that I've added table box-sizing: border-box !important;. Any insight of the problem will be much appreciated.

Thanks!

I have tested in your demo and I found that if i add more th to the thead, the th will be hidden if it overflows the window, and the width of th and td in tbody is not same. Just like the picture shows.

This line is directly binding the callback to the scroll event. Repeatedly calling functions during scroll can hurt performance.

Based on the demo it appears that if you resize the window the table headers appear misaligned.

it keeps giving me error : Cannot read property 'tagName' of null

is there any solution to this ?

For this issue the 1.1.0 version isn't downloadable with bower install

The implementation for lrStickyHeader does not work for IE browser. Things like ScrollTop are used, which are not supported for IE. Can you please make this working for IE browsers as well, at least IE11 and higher versions?

Pardon for the neophyte question, but can your directive be slapped onto a table and it know the parents elements height (i.e. div) and make it sticky within the parent element and not the top of the page?

Thanks in advance! Great plugins you have made!

acg

I am current struggling how to inject lrStickyHeader to angular app to be able to call: lrStickyHeader(element[0]) as from example
as in strict DI mode, we need explicitly specify lrStickyHeader as a dependency

it doesn't work with me , and gives me error tagname is undefined , here's the pen
http://codepen.io/mohamed_sobhy292/pen/PporRY