{"id":17069832,"url":"https://github.com/jlong/snakejs","last_synced_at":"2025-03-23T10:44:17.009Z","repository":{"id":9342589,"uuid":"11191631","full_name":"jlong/snakejs","owner":"jlong","description":"The micro selector and events library for IE8+ perfectly suited for widgets and simple applications or websites.","archived":false,"fork":false,"pushed_at":"2013-07-08T01:41:29.000Z","size":312,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-28T17:17:26.722Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","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/jlong.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":"2013-07-05T04:29:59.000Z","updated_at":"2018-08-24T16:52:46.000Z","dependencies_parsed_at":"2022-09-14T01:02:27.778Z","dependency_job_id":null,"html_url":"https://github.com/jlong/snakejs","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/jlong%2Fsnakejs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jlong%2Fsnakejs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jlong%2Fsnakejs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jlong%2Fsnakejs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jlong","download_url":"https://codeload.github.com/jlong/snakejs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245090865,"owners_count":20559296,"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-14T11:28:02.068Z","updated_at":"2025-03-23T10:44:16.981Z","avatar_url":"https://github.com/jlong.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Snake.js\n--------\n\nThe micro selector and events library perfectly suited for widgets and simple\napplications or websites.\n\nBrowser support: IE8+ and other modern browsers (Chrome, Safari, Firefox).\n\nOriginally created by UserVoice for our widget framework (http://uservoice.com).\nLater extracted into a library by John W. Long (@johnwlong).\n\n\n### Selecting elements\n\nThe $ function (aka snake function) can be used as a cross-browser\nquerySelector(). Compared to jQuery the functionality it supports is quite\nlimited, but it works well for some applications.\n\nIn its simplest form it only looks up divs by a class name:\n\n    $('content')                // Find a div with a class of 'content'\n\nBut you can also pass a specific tag to find other types of tags:\n\n    $('a', 'external')          // Find a link with a class of 'external'\n\nIt can also be invoked on an element to find child elements:\n\n    $(el, 'post')               // Find a div with a class of 'post' inside of el\n    $(el, 'article', 'post')    // Find an article tag with a class of 'post' inside of el\nThe $.all function is similar to the $ function except that much like\nquerySelectorAll() it returns an array of matching elements. In the\nevent that no elements are found an empty array is returned.\n\nThe $.all function supports the same parameters as the $ function:\n\n    $.all('post')               // All divs with a class name of 'post'\n    $.all(el, 'post')           // All 'post' divs inside of el\n\n    $.all('a', 'external')      // All links with a class name of 'external'\n    $.all(el, 'a', 'external')  // All 'external' links inside of el\n\n\n### Retreiving IDs\n\nThe $.identify function can be used to obtain an ID for a given element:\n\n    var el = document.createElement('div');\n    el.id = 'main';\n    $.identify(el);   // =\u003e 'main'\n\nIf the element doesn't have an ID, One will be generated for it. For instance:\n\n    var el = document.createElement('div');\n    $.identify(el);   // =\u003e 'snakejs-1'\n\n\n### Storing data\n\nThe $.data function can be used to associate and retrieve arbitrary data with\nan element. The data is stored in a global object and associated by the ID\nof the element. If the element does not have an ID, the $.identify function\nis used to ensure that it does.\n\nTo store data for an element, pass in a key and value:\n\n    $.data(el, 'tooltip', 'An example tooltip.');\n\nTo retrieve data for an element, simply pass in the key:\n\n    $.data(el, 'tooltip'); // =\u003e \"An example tooltip.\"\n\n\n### Manipulating classes\n\nUse the $.addClass function to add a class to an element:\n\n    $.addClass(el, 'is-hidden');\n\nUse the $.removeClass function to remove a class from an element:\n\n    $.removeClass(el, 'is-hidden');\n\nUse the $.hasClass function to test if an element has a class:\n\n    if ($.hasClass(el, 'is-hidden') {\n      // el is hidden\n    }\n\n\n### Getting dimensions and offset\n\nUse the $.dimensions function to retreive the width and height of an element.\nThis function should work even if the element is invisible. Just call:\n\n    $.dimensions(el)  // =\u003e { width: 200, height: 100 }\nUse the $.offset function to get an element's coordinates relative to the\nentire page:\n\n    $.offset(el)      // =\u003e { top: 10, left: 20 }\n\n\n### Adding and removing events\n\nUse the $.on function to add an event listener to an element. For example:\n\n    $.on(el, 'click', function(e) {\n      console.log('clicked');\n    });\n\nUse the $.off function to remove an event listener from an element:\n\n    var listener = function() { ... };\n    $.on(el, 'click', listener);\n    $.off(el, 'click', listener);\nUse the $.one to add an event listener that will be removed the first time\nit is invoked:\n\n    $.one(el, 'mousemove', function(e) {\n      console.log('This should only ever be logged one time.');\n    });\n\n\n### DOM ready\n\nUse the $.ready function to add a DOM ready event listener. This listener\nwill be fired when the DOM has been fully loaded.\n\n    $.ready(function() {\n      console.log('The DOM is loaded!');\n    });\n\n\n### MIT License\n\nCopyright (c) 2013 John W. Long. Portions contributed by Austin Taylor,\nJonathan Novak, and Mark Martin.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is furnished\nto do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjlong%2Fsnakejs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjlong%2Fsnakejs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjlong%2Fsnakejs/lists"}