https://github.com/segment-boneyard/modal

A simple modal UI component.
https://github.com/segment-boneyard/modal

Last synced: about 5 hours ago
JSON representation

A simple modal UI component.

• Host: GitHub
• URL: https://github.com/segment-boneyard/modal
• Owner: segment-boneyard
• Created: 2013-08-20T21:33:01.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2015-01-06T20:11:06.000Z (almost 10 years ago)
• Last Synced: 2024-04-09T16:31:12.400Z (7 months ago)
• Language: JavaScript
• Size: 300 KB
• Stars: 13
• Watchers: 45
• Forks: 7
• Open Issues: 4
• Metadata Files:
  • Readme: Readme.md
  • Changelog: History.md

Awesome Lists containing this project

README

        
# modal

  A simple modal UI component.

## Installation

    $ component install segmentio/modal

## Example

```js

var modal = require('modal');

modal(el).show();

```

  To use it, pass in the `el` you want to "modal-ize".

## API

```html



  { Your element gets injected here. }



```


A [`segmentio/overlay`](https://github.com/segmentio/overlay) element (with an `.Overlay` class) is used to create the mask above the screen, so if you've already themed it you've got no more work to do.

### Modal(el)

  Create a new `Modal` instance with the given `el`.

### #show(fn)

  Show the modal, emitting `show`, optionally calling `fn`.

### #hide(fn)

  Hide the modal, emitting `hide`, optionally calling `fn`.

### #closeable() or #closable()

  Make the modal closeable.

### #overlay()

  Shows an overlay with the modal.

### #effect(name)

  See the effect name. Comes bundled with `toggle`, `slide-in-bottom`, `sticky-up` and `fade-and-scale`.

### #addClass(name)

  Add a class `name` to the `.Modal`

### #removeClass(name)

  Remove a class `name` from the `.Modal`.

## License

  MIT