{"id":21316095,"url":"https://github.com/cjsaylor/scrolltab","last_synced_at":"2025-07-12T01:31:38.275Z","repository":{"id":1024430,"uuid":"852388","full_name":"cjsaylor/Scrolltab","owner":"cjsaylor","description":"jQuery plugin to add tabs visually associated to their position relative to the scroll bar.","archived":false,"fork":false,"pushed_at":"2014-08-23T22:08:37.000Z","size":426,"stargazers_count":54,"open_issues_count":0,"forks_count":12,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-06-20T23:07:11.310Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://chris-saylor.com/Scrolltab/","language":"JavaScript","has_issues":true,"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/cjsaylor.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":"2010-08-21T00:05:57.000Z","updated_at":"2022-01-11T08:26:17.000Z","dependencies_parsed_at":"2022-07-15T06:16:14.361Z","dependency_job_id":null,"html_url":"https://github.com/cjsaylor/Scrolltab","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/cjsaylor/Scrolltab","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cjsaylor%2FScrolltab","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cjsaylor%2FScrolltab/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cjsaylor%2FScrolltab/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cjsaylor%2FScrolltab/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cjsaylor","download_url":"https://codeload.github.com/cjsaylor/Scrolltab/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cjsaylor%2FScrolltab/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264923080,"owners_count":23683716,"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-11-21T18:29:41.029Z","updated_at":"2025-07-12T01:31:37.944Z","avatar_url":"https://github.com/cjsaylor.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Scrolltab is a jQuery plugin that adds tabs visually associated to their position relative to the scroll bar.\n\nThis enables a developer to attach floating tabs to the scrollbar of the brwoser that will scroll the user to the position indicated by the tab.  This tab is expandable with content within.\n\n## Demo\n\nhttp://chris-saylor.com/Scrolltab/example.html\n\n## Install\n\nThere are two ways of installing:\n\n1. Bower - ```bower install jquery-scrolltab```\n\n2. Download - You can install traditionally by downloading the [minified version](https://github.com/cjsaylor/Scrolltab/releases/latest).\n\n## Options\n\n* `title`: HTML to display within the pin\n* `classname`: The classname for the pin to use\n* `mouseenter`: function to execute when the mouseenter event fires on this pin\n* `mouseleave`: function to execute when the mouseleave event fires on this pin\n* `click`: function to execute when the click event fire on this pin\n\n## Setting Options via `data` attributes\n\nYou can set the title and classname of the pin via data attributes on the object.\n\n```html\n\u003ch4 class=\"scrolltab\" data-st-title=\"Pin Title\" data-st-classname=\"custom-pin-class\"\u003eTitle\u003c/h4\u003e\n```\n\n## Behaviors\n\nThe behavior of how the pin displays and hides is customizable by overriding the behavior functions.\n\n#### Initial Display\n\nWhen a new pin is created by the `.scrolltab()` call.\n\n* Default behavior: `fadeIn('slow')`\n\n```\n$.fn.scrolltab.pinInitialDisplay\n```\n\n#### Display On Update\n\nIf the element the scrollpin was tracking becomes visible again, this will redisplay the pin.\n\n* Default behavior: `fadeIn('slow')`\n\n```\n$.fn.scrolltab.pinDisplay\n```\n\n#### Pin Hide\n\nIf the element the scrollpin was tracking is hidden from the dom, this will hide the pin.\n\n* Default behavior: `fadeOut('fast')`\n\n```\n$.fn.scrolltab.pinHide\n```\n\n## Examples\n\n```javascript\n\t// Enables a pin with the default classname\n\t$('\u003cdom object\u003e').scrolltab();\n```\n\n```javascript\n\t// Changes the classname of the created (or existing) pin\n\t$('\u003cdom object\u003e').scrolltab({ classname: 'test' });\n```\n\n```javascript\n\t// Modifies the behavior of the click event on the pin\n\t$('\u003cdom object').scrolltab({\n\t\tclick: function (e) {\n\t\t\te.preventDefault();\n\t\t\talert('Pin clicked.')\n\t\t}\n\t});\n```\n\n```javascript\n\t// Modify the initial behavior of pins showing on page load\n\t$.fn.scrolltab.pinInitialDisplay = function(pin) {\n\t\t// I don't want the fancy fadein affect.\n\t\tpin.show();\n\t};\n\t$('\u003cdom object\u003e').scrolltab();\n```\n\n```javascript\n\t// Modify the default attributes of all pins created now on\n\t// In this example, I want all pins to have a click event function\n\t// callback attached.\n\t$.fn.scrolltab.default = $.extend($.fn.scrolltab.default, {\n\t\tclick: function (e) {\n\t\t\te.preventDefault();\n\t\t\talert('Pin clicked!');\n\t\t}\n\t});\n\t$('\u003cdom object\u003e').scrolltab();\n```\n\n## Build\n\nScrolltab uses [Grunt CLI](http://gruntjs.com/) via [NodeJS](http://nodejs.org/) for linting and building the minified production file.\n\n#### Setup\n\nInstall grunt cli globally:\n\n```bash\n$ npm install -g grunt-cli\n```\n\nInstall dev dependencies:\n\n```bash\n$ npm install -d\n```\n\nExecute lint and build:\n\n```bash\n$ grunt\n```\n\n## License\n\nThis software is protected under the MIT license.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcjsaylor%2Fscrolltab","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcjsaylor%2Fscrolltab","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcjsaylor%2Fscrolltab/lists"}