“I continue to be astounded by the sheer breadth of what can do.So my question is: how can I handle that in one single component?Ĭonst DrawerNavBar = () =>, ) I know I could solve my problem by creating three different drawer components with their own timeline, mounting/unmounting on window resize, but I guess this is not an optimized solution. On resize the drawer navbar content seems to collapse and disappear. I passed size.width as a dependency to useEffect() as shown below. I tried to solve that with a custom hook which returns size.width (this hook works fine). Depending on the window size I need to animate the drawer navbar and its content a bit differently (like width on laptop, and height on tablet and phone). On laptop it's at the left of the window, and on smaller devices it's at the top. Note that the theme can be adjusted to style the fixed header appropriately: thead div.I've got a drawer navbar in my app which mounts/unmounts - slides in/slides out on toggle. ![]() For now, no browser checking is provided so we can test it. But, I think this feature is too handy to not have, so we could just disable it for IE6 users (their loss). This does mean that it won't work in at least IE6, and maybe IE7. It uses "position: fixed", so it does not lag behind the scrolling and does not slow down rendering (much). Multiple tables per page are supported (the header will disappear if you scroll beyond the end of a table). This patch remedies this by letting the table header scroll along when it reaches the top of the browser view. When scrolling through long tables, it is hard to know which column is what.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |