[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3676":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":15,"rankGlobal":10,"rankLanguage":10,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":22,"hasPages":24,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":34,"readmeContent":35,"aiSummary":36,"trendingCount":16,"starSnapshotCount":16,"syncStatus":18,"lastSyncTime":37,"discoverSource":38},3676,"intro.js","usablica\u002Fintro.js","usablica","Lightweight, user-friendly onboarding tour library","http:\u002F\u002Fintrojs.com",null,"TypeScript",23471,2558,440,45,0,1,2,9,3,"Other",false,"master",true,[26,27,28,29,30,31,32,33],"cdn","guide","html","introjs","javascript","minify","tour","ux","2026-06-12 02:00:52","# Intro.js\n\n[![Build Status](https:\u002F\u002Ftravis-ci.org\u002Fusablica\u002Fintro.js.svg?branch=master)](https:\u002F\u002Ftravis-ci.org\u002Fusablica\u002Fintro.js)\n[![](https:\u002F\u002Fdata.jsdelivr.com\u002Fv1\u002Fpackage\u002Fnpm\u002Fintro.js\u002Fbadge)](https:\u002F\u002Fwww.jsdelivr.com\u002Fpackage\u002Fnpm\u002Fintro.js)\n[![npm](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fdm\u002Fintro.js)](https:\u002F\u002Fwww.jsdelivr.com\u002Fpackage\u002Fnpm\u002Fintro.js)\n\n> User Onboarding and Product Walkthrough Library\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fintrojs.com\">\n    \u003Cimg src=\"https:\u002F\u002Fraw.githubusercontent.com\u002Fusablica\u002Fintro.js\u002Fgh-pages\u002Fimg\u002Fintrojs-demo.png\">\n  \u003C\u002Fa>\n\u003C\u002Fp>\n\n## Where to get\nYou can obtain your local copy of Intro.js from:\n\n**1)** This GitHub repository, using ```git clone https:\u002F\u002Fgithub.com\u002Fusablica\u002Fintro.js.git```\n\n**2)** Using yarn ```yarn add intro.js```\n\n**3)** Using npm ```npm install intro.js --save```\n\n**4)** Download it from CDN ([1](http:\u002F\u002Fwww.jsdelivr.com\u002Fprojects\u002Fintro.js), [2](https:\u002F\u002Fcdnjs.com\u002Flibraries\u002Fintro.js))\n\n## How to use\nIntro.js can be added to your site in three simple steps:\n\n**1)** Include `intro.js` and `introjs.css` (or the minified version for production) in your page. Use `introjs-rtl.min.css` for Right-to-Left language support.\n\n> CDN hosted files are available at [jsDelivr](http:\u002F\u002Fwww.jsdelivr.com\u002Fprojects\u002Fintro.js) (click Show More) & [cdnjs](https:\u002F\u002Fcdnjs.com\u002Flibraries\u002Fintro.js).\n\n**2)** Add `data-intro` and `data-step` to your HTML elements. To add hints you should use `data-hint` attribute.\n\nFor example:\n\n```html\n\u003Ca href='http:\u002F\u002Fgoogle.com\u002F' data-intro='Hello step one!'>\u003C\u002Fa>\n````\n\nSee all attributes [here](https:\u002F\u002Fintrojs.com\u002Fdocs\u002Fintro\u002Fattributes\u002F).\n\n**3)** Call this JavaScript function:\n```javascript\nintroJs().start();\n````\n\nOptionally, pass one parameter to `introJs` function to limit the presentation section.\n\n**For example** `introJs(\".introduction-farm\").start();` runs the introduction only for elements with `class='introduction-farm'`.\n\n## Documentation\n\nPlease visit [Documentation](http:\u002F\u002Fintrojs.com\u002Fdocs).\n\n## Using with:\n\nIntro.js has many wrappers for different purposes. Please visit [Documentation](http:\u002F\u002Fintrojs.com\u002Fdocs) for more info.\n\n## Build\n\nFirst you should install `nodejs` and `npm`, then first run this command: `npm install` to install all dependencies.\n\nNow you can run this command to minify all static resources:\n\n    npm run build\n\n## Contributors ✨\n\n\u003C!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->\n\u003C!-- prettier-ignore-start -->\n\u003C!-- markdownlint-disable -->\n\u003Ctable>\n  \u003Ctr>\n    \u003Ctd align=\"center\">\u003Ca href=\"http:\u002F\u002Fafshinm.name\">\u003Cimg src=\"https:\u002F\u002Favatars3.githubusercontent.com\u002Fu\u002F314326?v=4\" width=\"100px;\" alt=\"\"\u002F>\u003Cbr \u002F>\u003Csub>\u003Cb>Afshin Mehrabani\u003C\u002Fb>\u003C\u002Fsub>\u003C\u002Fa>\u003Cbr \u002F>\u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fusablica\u002Fintro.js\u002Fcommits?author=afshinm\" title=\"Code\">💻\u003C\u002Fa> \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fusablica\u002Fintro.js\u002Fcommits?author=afshinm\" title=\"Documentation\">📖\u003C\u002Fa>\u003C\u002Ftd>\n    \u003Ctd align=\"center\">\u003Ca href=\"https:\u002F\u002Fbozdoz.com\">\u003Cimg src=\"https:\u002F\u002Favatars0.githubusercontent.com\u002Fu\u002F1410985?v=4\" width=\"100px;\" alt=\"\"\u002F>\u003Cbr \u002F>\u003Csub>\u003Cb>bozdoz\u003C\u002Fb>\u003C\u002Fsub>\u003C\u002Fa>\u003Cbr \u002F>\u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fusablica\u002Fintro.js\u002Fcommits?author=bozdoz\" title=\"Code\">💻\u003C\u002Fa> \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fusablica\u002Fintro.js\u002Fcommits?author=bozdoz\" title=\"Documentation\">📖\u003C\u002Fa>\u003C\u002Ftd>\n  \u003C\u002Ftr>\n\u003C\u002Ftable>\n\n\u003C!-- markdownlint-enable -->\n\u003C!-- prettier-ignore-end -->\n\u003C!-- ALL-CONTRIBUTORS-LIST:END -->\n\n## Support\u002FDiscussion\n- [Stackoverflow](http:\u002F\u002Fstackoverflow.com\u002Fquestions\u002Ftagged\u002Fintro.js)\n\n## Usage Trends\n- [Usage Trends of Product Walkthrough Libraries](https:\u002F\u002Fnpm-compare.com\u002Fintro.js,@reactour\u002Ftour,driver.js,vue-tour)\n\n## License\n\n### Commercial license\n\nIf you want to use Intro.js for a commercial application, theme or plugin the commercial license is the appropriate license. With this option, your source code is kept proprietary. Purchase a commercial license at [introjs.com](http:\u002F\u002Fintrojs.com\u002F#commercial)\n\n### Open-source license\n\nGNU AGPLv3\n","Intro.js 是一个轻量级、用户友好的引导游览库，主要用于网站和应用程序的新手引导。其核心功能包括通过简单的 HTML 属性设置来添加提示和步骤，支持 RTL 语言，并且可以很容易地集成到现有的项目中。使用 TypeScript 编写，确保了代码的质量与类型安全。此外，它还提供了丰富的自定义选项以及多种 CDN 方式获取资源，方便开发者快速部署。适用于需要向用户介绍新功能或指导用户如何使用复杂界面的各种 Web 应用场景。","2026-06-11 02:55:29","top_language"]