{"id":15732278,"url":"https://github.com/stopsopa/elkanatooltip","last_synced_at":"2026-03-18T17:41:33.017Z","repository":{"id":31018136,"uuid":"34576622","full_name":"stopsopa/elkanatooltip","owner":"stopsopa","description":"(Ooooold) Yet another toolbar jQuery plugin, but this time with full api control","archived":false,"fork":false,"pushed_at":"2023-09-02T20:06:30.000Z","size":275,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-27T04:38:14.092Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"HTML","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/stopsopa.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2015-04-25T16:42:45.000Z","updated_at":"2023-09-02T00:20:22.000Z","dependencies_parsed_at":"2024-10-19T07:38:14.768Z","dependency_job_id":"bbbea479-0ec7-4492-a8ae-1afeb530586a","html_url":"https://github.com/stopsopa/elkanatooltip","commit_stats":{"total_commits":31,"total_committers":2,"mean_commits":15.5,"dds":"0.16129032258064513","last_synced_commit":"886ec4f56955cd9d2273f1940ee541d870c4beef"},"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stopsopa%2Felkanatooltip","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stopsopa%2Felkanatooltip/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stopsopa%2Felkanatooltip/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stopsopa%2Felkanatooltip/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stopsopa","download_url":"https://codeload.github.com/stopsopa/elkanatooltip/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246409764,"owners_count":20772545,"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-04T00:08:50.605Z","updated_at":"2026-01-07T19:58:07.803Z","avatar_url":"https://github.com/stopsopa.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# DEPRECATED\nCreated in 2015 - quite old now and not maintained.\n\n# demo\n- [generator.html](http://stopsopa.github.io/elkanatooltip/generator.html)\n- [demo.html](http://stopsopa.github.io/elkanatooltip/demo.html)\n- [katownik.html](http://stopsopa.github.io/elkanatooltip/katownik.html)\n- [docs/index.html](http://stopsopa.github.io/elkanatooltip/docs/index.html)\n\n# stopsopa/elkanatooltip\n\nYet another toolbar jQuery plugin, but this time with full api control \n\n## Usage, demo \u0026 css generator\n\n  [Demo](http://stopsopa.github.io/submod/elkanatooltip/demo.html)\n\n***\n\n## Npm instalation \n\n\u003ca href=\"https://www.npmjs.com/package/elkanatooltip\"\u003e\n\u003cimg width=\"60\" src=\"https://www.npmjs.com/static/images/npm-logo.svg\"\u003e\n\u003c/a\u003e\n\n\n\n### Api description\n\nFirst follow instructions of installation on [npm](https://www.npmjs.com/package/elkanatooltip) and [demo](http://stopsopa.github.io/submod/elkanatooltip/demo.html).\nThen you need to understand few things:\n\n\n#### you can have multiple tooltip styles on one pages by [generating](http://stopsopa.github.io/submod/elkanatooltip/generator.html) separate css files. The only requirements is to have different [class name](http://stopsopa.github.io/submod/elkanatooltip/generator.html?tour=.controls%20tr:first%20input) in each css file (this is some kind of namespace or id for each style). \nThen you can include styles like this ...\n\n\n  \n```html\n\u003cscript src=\"jquery.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"jquery.elkanatooltip.js\"\u003e\u003c/script\u003e\n\u003clink rel=\"stylesheet\" type=\"text/css\" href=\"elkanatooltip_first-style-class.css\" /\u003e\n\u003clink rel=\"stylesheet\" type=\"text/css\" href=\"elkanatooltip_second-style-class.css\" /\u003e        \n```  \n\n... and after that you are ready to use each style like below :\n\n\n```javascript\n\nvar options = {\n    \"position\": {\n        \"my\": \"top\",\n        \"at\": \"bottom\"\n    }\n};\n\nvar dct = $('.default-style-class-target');\nvar dci = $('.default-style-class-tip');\ndct.elkanatooltip(dci, options); // class will be default: 'elkanatooltip'\n\nvar fct = $('.first-style-class-target');\nvar fci = $('.first-style-class-tip');\nfct.elkanatooltip(fci, options, 'first-class'); \n\nvar sct = $('.second-style-class-target');\nvar sci = $('.second-style-class-tip');\nsct.elkanatooltip(sci, options, 'second-class'); \n    \n```  \n\n#### show hide\n\nIf tooltip is already initialized, then you can show or hide tooltip:\n\n```javascript\ntarget.elkanatooltip(true); // show\ntarget.elkanatooltip(false); // hide    \n```  \n\nYou can examine - if tooltip is visible or hidden - under:\n \n```javascript\ntarget.elkanatooltip().show;    \n```  \n\n... so you can easly toggle tooltip by ...\n \n```javascript\ntarget.elkanatooltip( ! target.elkanatooltip().show);   \n```  \n\n.. or using special method for that:\n \n```javascript\ntarget.elkanatooltip('toggle');   \n```  \n\n\nIf target is moving around page (for example it is draggable element) to reposition tooltip again on target simply do ...\n\n\n```javascript\ntarget\n    .draggable({ \n        drag: function () { \n            target.elkanatooltip(true);\n        }\n    });\n```  \n\n* this draggable examples require [jQuery UI draggable](//jqueryui.com/draggable/)\n\n... or even better to get more consist positioning (you don't need to worry about existence of process.nextTick, it is polifiled by elkanatooltip itself) ...\n\n```javascript\ntarget\n    .draggable({ \n        drag: function () {                        \n            process.nextTick(function() {\n                target.elkanatooltip(true);\n            })\n        }\n    });\n```  \n \n\n#### correction\n\nIt is possible to adjust position of tooltip manually during initialization:\n\n\n\n```javascript\nvar options = {\n    \"ui\": {\n        \"my\": \"top\",\n        \"at\": \"bottom\"\n    },\n    offset: {\n        left: 20,\n        top: -10\n    }\n};\n\nvar dct = $('.default-style-class-target');\nvar dci = $('.default-style-class-tip');\ndct.elkanatooltip(dci, options);\n\n```  \n\n#### destroy\n\nTo destroy component and reverse all states of divs simply call \n\n\n```javascript\nvar dct = $('.default-style-class-target');\ndct.elkanatooltip('destroy');\n\n```  \n\n#### events \n\nafterShow and afterHide are triggered at the end of css show or hide animation (if animations are defined, if they are not defined, events are called immediately)\n\n```javascript\n\nvar options = {\n    position: {\n        my: \"top\",\n        at: \"bottom\"\n    },\n    afterShow: function () {\n        // eg: $(this).elkanatooltip().show\n    },\n    afterHide: function () {\n        // eg: $(this).elkanatooltip().show\n    }\n};\n\n...\n\n``` \n\n#### within \n\nElement to position within, affecting collision detection. If you provide a selector or jQuery object, the first matching element will be used.\n\n```javascript\n\nvar options = {\n    position: {\n        my: \"top\",\n        at: \"bottom\",\n        within: $('.selector')\n    }\n};\n\n...\n\n``` \n\n \n## Tips\n \nElkanatooltip is designed in way that allow You to customize manually entire view in css, that includes also style of animation on hiding or showing tooltip (this was not easy to implement). These type of manual modification of css file shouldn't spoil any behaviour of plugin, so i encourage You to do that.\n\nMost of chenges can be done manually in css, for all rest what must be done with proper recalculations You can make by [generatior](http://stopsopa.github.io/submod/elkanatooltip/generator.html).\n\nNotice that in the first line of generated file is permalink that You can use to restore all states of generator in order to adjust previousely made style.\n \nThis plugin is low level of future tools. Main job of this tool is to create tooltip on top of pointed div, show, hide (with animation or not) and reposition this tooltip. \n\nAny bugs reports or pull request are welcome.\n\nCheers :)\n\n\n### License\n\nThe MIT License (MIT)\nCopyright (c) 2016 Szymon Działowski\nPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\nThe above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstopsopa%2Felkanatooltip","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstopsopa%2Felkanatooltip","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstopsopa%2Felkanatooltip/lists"}