Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

17 Commits

Repository files navigation

sheet

A special modal that slides out from the right or left side of the screen.

example of a sheet

Installation

$ component install segmentio/sheet

Example

varsheet=require('sheet');sheet(el).show();

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

API

<divclass="Modal" effect="sheet-left"><divclass="Sheet"><aclass="Sheet-close-button"></a>
{ Your element gets injected here. }
</div></div><divclass="Overlay"></div>

A 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.

Sheet(el)

Create a new Sheet instance with the given el.

#show(fn)

Show the sheet, emitting show, optionally calling fn.

#hide(fn)

Hide the sheet, emitting hide, optionally calling fn.

#addClass(name)

Add a class name to the .sheet and .sheet-overlay.

#removeClass(name)

Remove a class name from the .sheet and .sheet-overlay.

License

MIT

About

A special modal that slides out from the right or left side of the screen.

Resources

Stars

142 stars

Watchers

37 watching

Forks

Releases

Packages

Contributors

Languages