micromodal
Advanced tools
Tiny, dependency-free javascript library for creating accessible modal dialogs
The aim of this library is to make modal dialogs accessible and easy to include in your project with minimum configuration. It's only ~1.8kb minified and gzipped - A tiny library for big change.
✔ Toggles relevant aria attributes on open and close
✔ Closes modal on overlay click
✔ Closes modal on pressing the esc key
✔ Traps tab focus within the modal
✔ Focuses on the first focusable element within the modal
✔ Retains the focused element state after closing the modal
via npm
npm install micromodal --save
via yarn
yarn add micromodal
via CDN direct link
<script src="https://cdn.jsdelivr.net/npm/micromodal/dist/micromodal.min.js"></script>
<!-- or -->
<script src="https://unpkg.com/micromodal/dist/micromodal.min.js"></script>
direct download
curl -o https://unpkg.com/micromodal/dist/micromodal.min.js
Please use this pollyfill suggested here.
Find the latest changelog here.
We are always open and invite developers to contribute to Micromodal. We have kept the guidelines and process dead simple, so you invest more time in making modals accessible to all.
Micromodal follows the standardjs coding standard and is part of our package.json file. It will help us to maintain consistency in the code base.
$ git clone https://github.com/ghosh/micromodal.gityarn package manager (Read installation guide)yarn install in the root folder to install all dependenciesyarn dev to start a dev server. This serves the example directory and live reloads when any files are changedyarn build to build the files for distribution. This is run automatically as a pre-commit hook as well.
This project is licensed under MIT license.
You can mention us on Twitter for any questions, suggestions or just send us funny GIF. We ♥️ GIFs.
Tweet about Micromodal and help us to spread the message about the importance of Web accessibility and Inclusive design.
Indrashish Ghosh – @_ighosh 🇮🇳
Kalpesh Singh - @knowkalpesh 🇮🇳
Darpan Kakadia - @kakadiadarpan 🇩🇪
Contributors - list 🌐
FAQs
Tiny javascript library for creating accessible modal dialogs
The npm package micromodal receives a total of 37,014 weekly downloads. As such, micromodal popularity was classified as popular.
We found that micromodal demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI confirms no security flaws were exploited in the Ultralytics supply chain attack and highlights improvements for safer package publishing.
Security News
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.