{"id":13656610,"url":"https://github.com/mkoryak/floatThead","last_synced_at":"2025-04-23T22:31:08.788Z","repository":{"id":4784992,"uuid":"5937246","full_name":"mkoryak/floatThead","owner":"mkoryak","description":"Fixed \u003cthead\u003e. Doesn't need any custom css/html. Does what position:sticky can't","archived":false,"fork":false,"pushed_at":"2023-03-10T17:25:33.000Z","size":2140,"stargazers_count":1219,"open_issues_count":3,"forks_count":195,"subscribers_count":40,"default_branch":"master","last_synced_at":"2025-04-11T06:14:11.962Z","etag":null,"topics":["cats-are-cute","floating-header","floatthead","header","jquery","scrolling","sticky","sticky-headers","table"],"latest_commit_sha":null,"homepage":"https://mkoryak.github.io/floatThead/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mkoryak.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null},"funding":{"github":"mkoryak","patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"custom":null}},"created_at":"2012-09-24T16:20:25.000Z","updated_at":"2025-04-07T03:13:43.000Z","dependencies_parsed_at":"2023-07-06T19:33:45.527Z","dependency_job_id":null,"html_url":"https://github.com/mkoryak/floatThead","commit_stats":{"total_commits":406,"total_committers":40,"mean_commits":10.15,"dds":0.6403940886699507,"last_synced_commit":"bae6126ced989d5bb235f0dce64d5b887945fa7e"},"previous_names":[],"tags_count":41,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkoryak%2FfloatThead","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkoryak%2FfloatThead/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkoryak%2FfloatThead/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkoryak%2FfloatThead/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mkoryak","download_url":"https://codeload.github.com/mkoryak/floatThead/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250526583,"owners_count":21445204,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cats-are-cute","floating-header","floatthead","header","jquery","scrolling","sticky","sticky-headers","table"],"created_at":"2024-08-02T05:00:25.399Z","updated_at":"2025-04-23T22:31:08.507Z","avatar_url":"https://github.com/mkoryak.png","language":"JavaScript","readme":"\u003cp align=\"left\"\u003e\n\u003ch1\u003e\n    \u003ca href=\"https://github.com/mkoryak/floatThead/releases\"\u003ejquery.floatThead\u003c/a\u003e\n    \u003ca href=\"https://unpkg.com/floatthead/dist/jquery.floatThead.min.js\"\u003e\u003cimg\n            src=\"http://img.badgesize.io/https://unpkg.com/floatthead/dist/jquery.floatThead.min.js?compression=gzip\u0026style=flat-square\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/floatthead\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/floatthead.svg?style=flat-square\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://github.com/mkoryak/floatThead/blob/master/LICENSE\"\u003e\u003cimg\n            src=\"https://img.shields.io/npm/l/floatthead.svg?style=flat-square\"\u003e\u003c/a\u003e\n\u003c/h1\u003e\n\u003c/p\u003e\n\n\n[![gif showing plugin in action](https://thumbs.gfycat.com/AnyGloriousAlpaca-size_restricted.gif)](http://mkoryak.github.io/floatThead/)\n\n## Documentation \u0026 Examples: http://mkoryak.github.io/floatThead/\n\nFloat the table header on scroll. No changes to your HTML/CSS are required, it just works.\nSupports floating the header while scrolling within the window or while scrolling within a container with overflow.\nSupports responsive tables.\n\n### Install\n\n#### Package managers\n```console\nnpm install floatthead\nbower install floatThead\n```\n#### Download code\n[Latest Release (zip)](https://github.com/mkoryak/floatThead/archive/2.2.5.zip)\n\n#### Via CDN\n[https://cdnjs.com/libraries/floatthead/](https://cdnjs.com/libraries/floatthead/)    \n[https://www.jsdelivr.com/#!jquery.floatthead](https://www.jsdelivr.com/#!jquery.floatthead)    \n[https://unpkg.com/floatthead](https://unpkg.com/floatthead)    \n\n```html\n\u003c!-- Latest compiled and minified JavaScript --\u003e\n\u003cscript src=\"https://unpkg.com/floatthead\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  $(() =\u003e $('table').floatThead());\n\u003c/script\u003e\n```\n\n#### For java people\n[Webjar](https://github.com/webjars/floatThead)\n\n### Wrappers\n[vuejs component](https://github.com/tmlee/vue-floatThead) by @tmlee\n\n[angularjs directive](https://github.com/brandon-barker/angular-floatThead) by @brandon-barker\n\n[yii2 framework wrapper](https://github.com/bluezed/yii2-floatThead) by @bluezed\n\n# Why not just use `position:sticky`?\n---------\nYou probably should! This plugin was created years before that existed. There are still a few reasons why you might want to use this plugin:  \n\n- Your code runs in the real world, where [some browsers](https://caniuse.com/css-sticky) don't support `position: sticky`.\n- Any kind of non-standard scroll parent scenario, where the thing that you scroll with is not supported by `position: sticky`. \n  - Your table's scroll parent isn't the body, but the body is what scrolls and you can't change this.\n  - Your table scrolls horizontally within a container, but vertically within the page. \n- Your sticky `top` position is dynamic, or you want to know when the header becomes sticky and you don't want to write code to do this.\n- You don't want to learn these newfangled CSS things, you want a proven solution that works and uses jQuery, the greatest thing ever!\n\n\n# Things this plugin does:\n---------\n-   In prod @ big corporations and opensource projects. Maintained. See open issues.\n-   Works on tables within a scrollable container or whole window scrolling\n-   Works with responsive table wrappers\n-   Works with dynamically hidden/added/removed columns\n-   Does not clone the thead - so your events stay bound\n-   Does what `position:fixed` cannot do (and on browsers that do not support it)\n-   Does not mess with your styles, and doesnt require any css (see `fixed` vs `absolute` position modes)\n-   Works with border-collapse variants, weird margins, padding and borders\n-   Works with libs like [datatables](http://datatables.net), [perfect-scrollbar](http://mkoryak.github.io/floatThead/examples/perfect-scrollbar/), [bootstrap3](http://mkoryak.github.io/floatThead/examples/bootstrap3/), and many more\n-   Header can be floated with `position:absolute` which adds a wrapper, or `position:fixed` which does not. Both have their pros and cons. By default the best option is chosen based on your configuration\n\n\n# Things this plugin does NOT do:\n---------\n-  Does not float the footer\n-  Does not let you lock the first column like in excel\n-  **Safari and mobile safari are not supported**. It might work, or it [might not](https://github.com/mkoryak/floatThead/issues/108), depending on your markup and safari version.\n-  RTL is not really supported - it might work in overflow scrolling mode, if you are lucky. Expects `dir` on `html` element.\n-  Layout issues resulting from document zoom not being 100% are not supported.\n\n\nCommon Pitfalls\n------\nIf you use css and html best practices, this plugin will work. If you are stuck in 1999, you better [read the faq](http://mkoryak.github.io/floatThead/faq/).\n\nHow to get help with the floatThead\n------------\nAll issues should be reported through github.\n\nRequirements:\n-------------\n\n-   jQuery 1.8.x or better (1.9 compliant) (or jQuery 1.7.x and jQuery UI core)\n\nSupported Browsers:\n-------------\n-   IE9 or better  (**must read** [this for ANY Internet Exploder integrations](http://mkoryak.github.io/floatThead/examples/row-groups/))\n-   Chrome, Firefox (all versions from last 10+ years)\n\n\nChange Log\n----------\n[see CHANGELOG.md](https://github.com/mkoryak/floatThead/blob/master/CHANGELOG.md)\n\n\n## Who is using floatThead ?\n\n### [Ctrl O](https://ctrlo.com)\n- Ctrl O provides simple and innovative products to help an organization's business processes. Linkspace, its flagship product, helps share information between teams and individuals, in a simple and effective manner.\n\n### [WheresTheGig.com](https://WheresTheGig.com) \n- A free service for the musical community \n\n### [Google](https://www.youtube.com/watch?v=dQw4w9WgXcQ) \n- Internally, I happen to know...\n \n### [tld-list.com](https://tld-list.com/)\n- The first table you see.\n\n### [Samsung](https://github.com/Samsung/iotjscode/blob/3d4de15ea32d27dce5885b2c8c9e3a783c846311/www/scripts/app/main.js#L234)\n- For the internet of things!\n\n### [Around 153,000 hits on github code search](https://github.com/search?q=floatThead\u0026ref=reposearch\u0026type=Code\u0026utf8=%E2%9C%93)\n\nLicense\n-------\nMIT\n","funding_links":["https://github.com/sponsors/mkoryak"],"categories":["JavaScript","Table/Grid","Table/Grid [🔝](#readme)","UI","表格/栅格","Animation"],"sub_categories":["Other","其它","Tables"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkoryak%2FfloatThead","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmkoryak%2FfloatThead","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkoryak%2FfloatThead/lists"}