{"id":16349420,"url":"https://github.com/alecrust/jquery-tabs","last_synced_at":"2025-11-11T14:30:15.820Z","repository":{"id":5391403,"uuid":"6580104","full_name":"AlecRust/jQuery-Tabs","owner":"AlecRust","description":"@simonsmith's No frills tabs plugin, suitable for responsive design","archived":false,"fork":false,"pushed_at":"2012-11-07T14:01:29.000Z","size":75,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-17T22:22:33.125Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/AlecRust.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-11-07T14:00:06.000Z","updated_at":"2015-01-20T23:38:31.000Z","dependencies_parsed_at":"2022-08-03T07:45:18.851Z","dependency_job_id":null,"html_url":"https://github.com/AlecRust/jQuery-Tabs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AlecRust%2FjQuery-Tabs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AlecRust%2FjQuery-Tabs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AlecRust%2FjQuery-Tabs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AlecRust%2FjQuery-Tabs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AlecRust","download_url":"https://codeload.github.com/AlecRust/jQuery-Tabs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239590440,"owners_count":19664484,"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":[],"created_at":"2024-10-11T00:59:40.547Z","updated_at":"2025-11-11T14:30:15.761Z","avatar_url":"https://github.com/AlecRust.png","language":"JavaScript","readme":"# jQuery Tabs\nNo frills tab switcher thingy. Focus on small file size and touchevent support\n\n## Usage\nTwo ways:\n\n__AMD Style__ (better!)\n\n```js\nrequire(['path/to/Tabs'], function(Tabs) {\n\tnew Tabs('.some-container', {\n\t\t// options\n\t})\n});\n```\nEnsure you have set a path to `jquery` in `require.config` (but you knew that already!)\n\n__Standard Style__ (less awesome)\n\n```js\n$.tabs('.some-container', {\n   // options\n});\n```\nDoesn't really follow the traditional jQuery plugin style, but I prefer AMD so this was just a quick addition for non-AMD users :)\n\n## Methods\n`setTab` - Pass it an index (zero based) to set that tab to visible\n\n```js\nvar tabs = $.tabs('.container');\n\ntabs.setTabs(2);\n```\n\n## Options\n\n```js\n{\n\t// Current visible tab (applied to nav and tab item\n\tcurrentClass: 'tab-current',\n\t\n    // Is the script active? Useful for applying display: none in \n    // an accessible manner\n\tactiveClass: 'js-tabs-active',\n\n\t// Called every time a tab changes. Passes the current selected nav\n\t// and the current showing item\n\tonShow: function(currentNav, currentItem) {\n\n\t},\n\t\n    // Which tab to start open\n\tactiveTab: 0,\n\t\n    // Elements to use (navTabs assumes there will be an \u003ca/\u003e element present)\n\tselectors: {\n\t\tnavTabs: '.tab-nav li',\n\t\tcontentItems: '.tab-item'\n\t}\n}\n```\n\n## Markup Example\nThe script pretty much only cares about selectors, so extra divs here and there won't break things. The following markup would be ideal:\n\n```html\n\u003cdiv class=\"tabs\"\u003e\n    \u003cnav\u003e\n        \u003cul class=\"tab-nav\" role=\"tablist\"\u003e\n            \u003cli\u003e\u003ca href=\"#item1\" role=\"tab\" aria-controls=\"item1\" role=\"presentation\" id=\"tab1\"\u003eItem 1\u003c/a\u003e\u003c/li\u003e\n            \u003cli\u003e\u003ca href=\"#item2\" role=\"tab\" aria-controls=\"item2\" role=\"presentation\" id=\"tab2\"\u003eItem 2\u003c/a\u003e\u003c/li\u003e\n            \u003cli\u003e\u003ca href=\"#item2\" role=\"tab\" aria-controls=\"item3\" role=\"presentation\" id=\"tab3\"\u003eItem 3\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n    \u003c/nav\u003e\n    \u003cul\u003e\n        \u003cli class=\"tab-item\" id=\"item1\" role=\"tabpanel\" aria-labelledby=\"tab1\"\u003e\n            \u003cimg src=\"http://placekitten.com/200/300\" alt=\"\"\u003e\n            I'm tab one\n        \u003c/li\u003e\n        \u003cli class=\"tab-item\" id=\"item2\" role=\"tabpanel\" aria-labelledby=\"tab2\"\u003e\n            \u003cimg src=\"http://placekitten.com/400/300\" alt=\"\"\u003e\n            I'm tab two\n        \u003c/li\u003e\n        \u003cli class=\"tab-item\" id=\"item3\" role=\"tabpanel\" aria-labelledby=\"tab3\"\u003e\n            \u003cimg src=\"http://placekitten.com/100/400\" alt=\"\"\u003e\n            I'm tab three\n        \u003c/li\u003e\n    \u003c/ul\u003e\n\u003c/div\u003e\n```\n\n## Demo\n\nhttp://jsfiddle.net/Blink/kRTX3/\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falecrust%2Fjquery-tabs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falecrust%2Fjquery-tabs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falecrust%2Fjquery-tabs/lists"}