Fast, light and responsive lightbox plugin, for jQuery and Zepto.js.
- Documentation and getting started guide.
- Examples and plugin home page.
- More examples in CodePen collection.
Optionally, install via Bower bower install magnific-popup or npm: npm install magnific-popup.
Ruby gem: gem install magnific-popup-rails.
- WordPress plugin - under development.
- Drupal module.
- Concrete5 add-on.
- Redaxo add-on.
- Contao extension.
If you created an extension for some CMS, email me and I'll add it to this list.
- Generated popup JS and CSS files are in folder dist/. (Online build tool is on documentation page).
- Source files are in folder src/. They include Sass CSS file and js parts (edit them if you wish to submit commit).
- Website (examples & documentation) is in folder website/.
- Documentation page itself is in website/documentation.md (contributions to it are very welcome).
If you used Magnific Popup in some interesting way, or on site of popular brand, I'd be very grateful if you <a href="mailto:[email protected]?subject="Site that uses Magnific Popup"">shoot me a link to it.
To compile Magnific Popup by yourself, first of make sure that you have Node.js, Grunt.js, Ruby and Jekyll installed, then:
-
Copy repository
-
Go inside Magnific Popup folder that you fetched and install Node dependencies
cd Magnific-Popup && npm install
-
Now simply run
gruntto generate JS and CSS in folderdistand site in folder_site/.grunt
Optionally:
- Run
grunt watchto automatically rebuild script when you change files insrc/or inwebsite/. - If you don't have and don't want to install Jekyll, run
grunt nositeto just build JS and CSS files related to popup indist/.
Script is MIT licensed and free and will always be kept this way. But has a small restriction from me - please do not create public WordPress plugin based on it(or at least contact me before creating it), because I will make it and it'll be open source too (want to get notified?).
Created by @dimsemenov & contributors.
