{"id":50711830,"url":"https://github.com/inspire-js/inspire.js","last_synced_at":"2026-06-26T16:01:05.553Z","repository":{"id":1149729,"uuid":"1033339","full_name":"inspire-js/inspire.js","owner":"inspire-js","description":"Lean, hackable, extensible slide deck framework. Previously known as CSSS.","archived":false,"fork":false,"pushed_at":"2026-06-03T13:06:51.000Z","size":734,"stargazers_count":1752,"open_issues_count":25,"forks_count":252,"subscribers_count":72,"default_branch":"master","last_synced_at":"2026-06-03T15:06:24.533Z","etag":null,"topics":["presentation","slidedeck","slideshow"],"latest_commit_sha":null,"homepage":"http://inspirejs.org/","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/inspire-js.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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2010-10-28T22:09:05.000Z","updated_at":"2026-06-03T13:33:43.000Z","dependencies_parsed_at":"2024-12-25T23:03:50.289Z","dependency_job_id":"395e67b8-abb4-4977-97a7-dcf41a135824","html_url":"https://github.com/inspire-js/inspire.js","commit_stats":{"total_commits":410,"total_committers":13,"mean_commits":31.53846153846154,"dds":"0.20243902439024386","last_synced_commit":"459d1f9e5ce7c46ddbe53bfb5150159dd27b011e"},"previous_names":["leaverou/csss","inspire-js/inspire.js"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/inspire-js/inspire.js","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inspire-js%2Finspire.js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inspire-js%2Finspire.js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inspire-js%2Finspire.js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inspire-js%2Finspire.js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/inspire-js","download_url":"https://codeload.github.com/inspire-js/inspire.js/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/inspire-js%2Finspire.js/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34823788,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-26T02:00:06.560Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["presentation","slidedeck","slideshow"],"created_at":"2026-06-09T16:00:35.629Z","updated_at":"2026-06-26T16:01:05.545Z","avatar_url":"https://github.com/inspire-js.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Inspire.js\n\n### Lean, hackable, extensible slide deck framework. Create basic slides by just writing HTML and CSS, do fancy custom stuff with JS, the sky is the limit!\n\n## Getting started\n\n### CDN\n\n```html\n\u003cscript src=\"https://inspirejs.org/inspire.js\"\u003e\u003c/script\u003e\n```\n\nor\n\n```js\nimport Inspire from \"https://inspirejs.org/inspire.mjs\";\n```\n\n### NPM\n\n```sh\nnpm install inspirejs.org\n```\n\nthen\n\n\n```html\n\u003cscript src=\"node_modules/inspirejs.org/inspire.js\"\u003e\u003c/script\u003e\n```\n\nor\n\n```js\nimport Inspire from \"node_modules/inspirejs.org/inspire.mjs\";\n```\n\nor if you use a bundler:\n\n```js\nimport Inspire from \"inspirejs.org\";\n```\n\n\n### Quick start\n\n- Copy (and rename) blank.html somewhere\n- Also copy talk.css, theme.css\n- Add Your Own Content\n- Add talk-specific styling to talk.css\n\n## Previously known as CSSS.\n\nIf you were using CSSS and would rather stay at it, run `git checkout v1.0.0` and stay there.\n\n\u003cdetails\u003e\n\n\u003csummary\u003eMigrating from CSSS\u003c/summary\u003e\n\n- Almost all HTML syntax is the same! The same JS events are still fired. So, very little should break.\n- `slideshow.css` is now `inspire.css`\n- `slideshow.js` is now `inspire.js`\n- You don't need to run JS to create a slideshow, it is created automatically.\n- The `SlideShow` JS class is now `Inspire`\n- The `slideshow` JS variable is now `Inspire`\n- Presenter view will not be loaded unless there is at least one `class=\"presenter-notes\"` item.\n- The CSS Controls plugin is now gone. Use [Mavo](https://mavo.io) if you need this functionality.\n- The CSS Snippets plugin is now gone. We will soon add a much better one, extracted based on the live demo script in https://github.com/leaverou/talks.\n- Incrementable is no longer a plugin. Use the separate script from https://github.com/leaverou/incrementable.\n- `reusable.css` has now been merged into the default theme, `theme.css`.\n- `data-import` is now `data-insert`\n\n\u003c/details\u003e\n\n## API FAQ\n\n### Running code after any imports have loaded\n\n```js\nawait Inspire.importsLoaded;\n// code to run after imports have loaded\n```\n\nNote that `await` needs to be inside an async function otherwise it will error. However, this could just be a self-executing async function.\n\n### Running code after a specific plugin has loaded\n\n```js\nawait Inspire.importsLoaded;\nawait Inspire.plugins.loaded.PLUGIN_ID.loaded;\n// code to run after the plugin with id PLUGIN_ID has loaded and executed\n```\n\nor:\n\n```js\nawait Inspire.loadPlugin(PLUGIN_ID);\n// code to run after the plugin with id PLUGIN_ID has loaded and executed\n```\n\nThe second example would load the plugin if it hasn't otherwise been loaded, but if it will never be loaded twice.\n\n### Running code when a specific slide is displayed\n\nYou can do this via the `slidechange` hook:\n\n```js\nInspire.hooks.add(\"slidechange\", env =\u003e {\n\tif (Inspire.currentSlide.id === \"slide-id\") {\n\t\t// Code to run\n\t}\n});\n```\n\nor, via an event:\n\n```js\ndocument.addEventListener(\"slidechange\", evt =\u003e {\n\tif (Inspire.currentSlide.id === \"slide-id\") {\n\t\t// Code to run\n\t}\n});\n```\n\n### Running code when a specific slide is displayed for the first time\n\nYou can do this via the `slidechange` hook:\n\n```js\nInspire.hooks.add(\"slidechange\", env =\u003e {\n\tif (Inspire.currentSlide.id === \"slide-id\" \u0026\u0026 env.firstTime) {\n\t\t// Code to run\n\t}\n});\n```\n\nor, via an event:\n\n```js\ndocument.addEventListener(\"slidechange\", evt =\u003e {\n\tif (Inspire.currentSlide.id === \"slide-id\" \u0026\u0026 evt.firstTime) {\n\t\t// Code to run\n\t}\n});\n```\n\nor:\n\n```js\n$(\"#slide-id\").addEventListener(\"slidechange\", evt =\u003e {\n\t// Code to run\n}, {once: true});\n```\n\n### Running code after a specific slide has been displayed\n\nYou can do this via the `slidechange` hook:\n\n```js\nInspire.hooks.add(\"slidechange\", env =\u003e {\n\tif (env.prevSlide.id === \"slide-id\") {\n\t\t// Code to run\n\t}\n});\n```\n\nor, via an event:\n\n```js\ndocument.addEventListener(\"slidechange\", evt =\u003e {\n\tif (evt.prevSlide.id === \"slide-id\") {\n\t\t// Code to run\n\t}\n});\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finspire-js%2Finspire.js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Finspire-js%2Finspire.js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finspire-js%2Finspire.js/lists"}