Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

mini-lightbox

Package Overview
Dependencies
Maintainers
1
Versions
19
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

mini-lightbox - npm Package Compare versions

Comparing version 1.3.1 to 2.0.0

dist/mini-lightbox.min.js

50

package.json
{
"name": "mini-lightbox",
"version": "1.3.1",
"version": "2.0.0",
"description": "Minimalist image lightbox",
"main": "index.js",
"main": "lib/index.js",
"directories": {

@@ -10,3 +10,4 @@ "test": "test"

"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"test": "echo \"Error: no test specified\" && exit 1",
"dist": "dist-it lib/index.js mini-lightbox.min.js"
},

@@ -24,3 +25,4 @@ "repository": {

"contributors": [
"Dawid Fajkowski <dawid.fajkowski@gmail.com>"
"Dawid Fajkowski <dawid.fajkowski@gmail.com>",
"Milan Wanielik <wanielik@gmail.com>"
],

@@ -44,3 +46,3 @@ "license": "MIT",

"<script>",
"MiniLightbox(\"#myImage\");",
" MiniLightbox(\"#myImage\");",
"</script>",

@@ -54,19 +56,19 @@ "```",

"MiniLightbox.customClose = function () {",
"var self = this;",
"self.img.classList.add(\"animated\", \"fadeOutDown\");",
"setTimeout(function () {",
"self.box.classList.add(\"animated\", \"fadeOut\");",
"setTimeout(function () {",
"self.box.classList.remove(\"animated\", \"fadeOut\");",
"self.img.classList.remove(\"animated\", \"fadeOutDown\");",
"self.box.style.display = \"none\";",
"}, 500);",
"}, 500);",
"// prevent default library behavior",
"return false;",
" var self = this;",
" self.img.classList.add(\"animated\", \"fadeOutDown\");",
" setTimeout(function () {",
" self.box.classList.add(\"animated\", \"fadeOut\");",
" setTimeout(function () {",
" self.box.classList.remove(\"animated\", \"fadeOut\");",
" self.img.classList.remove(\"animated\", \"fadeOutDown\");",
" self.box.style.display = \"none\";",
" }, 500);",
" }, 500);",
" // prevent default library behavior",
" return false;",
"};",
"",
"MiniLightbox.customOpen = function () {",
"this.box.classList.add(\"animated\", \"fadeIn\");",
"this.img.classList.add(\"animated\", \"fadeInUp\");",
" this.box.classList.add(\"animated\", \"fadeIn\");",
" this.img.classList.add(\"animated\", \"fadeInUp\");",
"};",

@@ -87,11 +89,9 @@ "```",

"MiniLightbox({",
"\"selector\": \".content img\"",
"// or the common parent where the images are appended",
", delegation: \"html\"",
" selector: \".content img\"",
" // the common container where the images are appended",
" , delegation: \"html\"",
"});",
"```"
],
"show_docs": false,
"license_year": "2014\n"
]
}
}

@@ -15,3 +15,3 @@ # mini-lightbox [![PayPal](https://img.shields.io/badge/%24-paypal-f39c12.svg)][paypal-donations] [![Version](https://img.shields.io/npm/v/mini-lightbox.svg)](https://www.npmjs.com/package/mini-lightbox) [![Downloads](https://img.shields.io/npm/dt/mini-lightbox.svg)](https://www.npmjs.com/package/mini-lightbox) [![Get help on Codementor](https://cdn.codementor.io/badges/get_help_github.svg)](https://www.codementor.io/johnnyb?utm_source=github&utm_medium=button&utm_term=johnnyb&utm_campaign=github)

<script>
MiniLightbox("#myImage");
MiniLightbox("#myImage");
</script>

@@ -25,19 +25,19 @@ ```

MiniLightbox.customClose = function () {
var self = this;
self.img.classList.add("animated", "fadeOutDown");
setTimeout(function () {
self.box.classList.add("animated", "fadeOut");
setTimeout(function () {
self.box.classList.remove("animated", "fadeOut");
self.img.classList.remove("animated", "fadeOutDown");
self.box.style.display = "none";
}, 500);
}, 500);
// prevent default library behavior
return false;
var self = this;
self.img.classList.add("animated", "fadeOutDown");
setTimeout(function () {
self.box.classList.add("animated", "fadeOut");
setTimeout(function () {
self.box.classList.remove("animated", "fadeOut");
self.img.classList.remove("animated", "fadeOutDown");
self.box.style.display = "none";
}, 500);
}, 500);
// prevent default library behavior
return false;
};
MiniLightbox.customOpen = function () {
this.box.classList.add("animated", "fadeIn");
this.img.classList.add("animated", "fadeInUp");
this.box.classList.add("animated", "fadeIn");
this.img.classList.add("animated", "fadeInUp");
};

@@ -58,11 +58,52 @@ ```

MiniLightbox({
"selector": ".content img"
// or the common parent where the images are appended
, delegation: "html"
selector: ".content img"
// the common container where the images are appended
, delegation: "html"
});
```
## Installation
Check out the [`dist`](/dist) directory to download the needed files and include them on your page.
## Documentation
### `MiniLightbox(options)`
Initializes the lightbox according to the options.
**Callbacks**:
The following methods can be used to modify the default behavior:
- `Minilightbox.customOpen` (Function): If it's a function, it will be
called then the lightbox is opened. If it returns `false`, the default
behavior will be prevented.
- `Minilightbox.customClose` (Function): If it's a function, it will be
called then the lightbox is closed. If it returns `false`, the default
behavior will be prevented.
#### Params
- **Object** `options`: An object containing the following fields:
- `selector` (String): The image query selector.
- `delegation` (String): The image container where to handle the delegation.
### `close(id)`
Closes the lightboxes.
#### Params
- **String** `id`: The lightbox id. If not provided, it will close all the opened lightboxes.
### `open(id)`
Opens the lightbox. This is called internally.
#### Params
- **String** `id`: The lightbox id.
## How to contribute
Have an idea? Found a bug? See [how to contribute][contributing].
## Where is this library used?
If you are using this library in one of your projects, add it in this list. :sparkles:
## License

@@ -69,0 +110,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc