Michaël Perrin

Sustainable web development.

Modal sheet dialogs in Javascript: Bootstrap modal sheet plugin

I tagged today the first version of my Javascript Bootstrap Modal Sheet library.

It’s available on Github at this address: https://github.com/michaelperrin/bootstrap-modal-sheet

I uploaded a demo page so that you can test it: demo page

What are modal sheet dialogs?

If you use (Mac) OS X, you probably know sheet dialogs. They are these little dialogs which slides down from the app’s window and do one of the following:

  • ask the user whether to save or not his document
  • warn the user about some action
  • asks for a question
  • show progress

Here is an example of such a modal sheet on OS X (Tower app pushing this project to Github):

OS X Modal sheet exampleOS X Modal sheet example

I never saw such kind of dialogs on the web before, and that’s why I decided to develop my own for this purpose.

The implementation is very similar to the Twitter Bootstrap modal and it requires jQuery as well.

This is how it looks like on the web, if you use the stylesheet I provide:

JS Boostrap Sheet exampleJS Boostrap Sheet example

I would be glad to hear about what you think of this first version of my library!Anyway, I’ll update it with new features soon.

Michaël Perrin

Read more posts by this author.

comments powered by Disqus