{%= description %} {%= descriptionMore %}
{%= badge("fury") %}
[(https://img.shields.io/bower/v/{%= name %}.svg)](https://github.com/{%= github.repopath %})
{%= badge("travis") %}
{%= badge("npm") %}
Check out the demo! Or the data-* attributes demo.
- Scroll-to-zoom
- Drag interaction
- Inline option
- Control buttons
- Different proportions for thumb vs. zoom
- CSS 3D transforms
- Full screen (coming soon)
- Event support, e.g. for stats/HUDs
- Touch interaction (pan, pinch)
- Analytics
- Stabilized scroll-to-zoom, better for touchpads
- Support
data-*attributes for #37.
{%= include("install-bower", {save: true}) %}
{%= include("install-npm", {save: true}) %}
If you're using AMD or Browersify, you'll probably just want to specify any main files you need, e.g. src/js/mag-jquery.js, as dependencies in your script(s).
You'll also want to include the CSS files below in your page.
Otherwise, you'll have to include individually in your page any main files you need, preceded by their dependencies.
- First, any dependencies of any main files you need:
{%= bowerDeps({indent: 1, shim: bowerShim}) %}
{%= bowerDepsHTML({shim: bowerShim}) %}
- Then, any main files you need:
{%= bowerMain({indent: 1}) %}
{%= bowerMainHTML() %}
See usage examples in demo. Also the JSDoc, especially options.
This component includes tracking via Google Analytics. The purpose is to better understand how and where it's used, as a guide for development.
To opt-out of this tracking, before loading the script on your page,
use the global options in JavaScript, with noTrack set to true, as follows:
window.MAGNIFICENT_OPTIONS = {
noTrack: true
};{%= include("contributing") %}
{%= include("contributing-extra") %}
{%= include("build-docs") %}
{%= include("tests") %}
See https://github.com/AndersDJohnson/magnificent.js/tree/v1.x.
{%= copyright({start: 2013, linkify: true}) %}. {%= license({linkify: true}) %}
{%= include("footer") %}