Collection of free jQuery modal/dialog window examples and plugins for advertisements, forms and a simple messages.

Collection of free jQuery modal/dialog window examples and plugins for advertisements, forms and a simple messages.

  1. CSS Modal Windows
  1. jQuery Modal/Dialog Examples
  2. jQuery Modal/Dialog Plugins

Author

  • evans

Made with

  • HTML (Pug) / CSS (Stylus) / JS

About a code

Modal

Sliding modal window made with jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Author

  • David Fitas

Made with

  • HTML / CSS / JS

About a code

Simple jQuery Modal

Simple modal window equipped with smooth CSS3 transitions. Commonly used for viewing annoyingly important content upon visiting a website.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js

Author

  • Bryce Snyder

Made with

  • HTML / CSS (Stylus) / JS

About a code

jQuery Modal with Animation

Success and wrong modal with animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, jquery.js

Author

  • lefoy

Made with

  • HTML / CSS (SCSS) / JS

About a code

Animated Modal Box

Animated fullscreen modal box.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Author

  • Michael Smith

Made with

  • HTML / CSS (SCSS) / JS

About a code

Swing Out Modal

Fun little modal concept in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: font-awesome.css, jquery.js

Author

  • LegoMushroom

Made with

  • HTML / CSS (Stylus) / JS (CoffeeScript)

About a code

Modal Window Destroy Concept

A small experiment on how to blow any HTML element.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js, howler.js, html2canvas.js

Author

  • Tey Tag

Made with

  • HTML / CSS (SCSS) / JS

About a code

Modal Animation Physics

Messing around with keyframe/transition physics for a modal. Mostly focused on the timing between the overlay, modal container, and modal content to try to make the whole event look more organic.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: font-awesome.css, jquery.js

Demo image: jQuery Avgrund

Made by

  • Dmitri Voronianski

Github activity

  • 1831 stars
  • 111 watchers

About the plugin

Avgrund

Avgrund is a jQuery plugin for your modal boxes and popups. It uses new concept showing depth between popup and page. It works in all modern browsers and gracefully degrade in those that do not support CSS transitions and transformations.

Demo image: iziModal

Made by

  • Marcelo Dolce

Github activity

  • 1678 stars
  • 81 watchers

About the plugin

iziModal

Elegant, responsive, flexible and lightweight modal plugin with jQuery.

Demo image: jQuery Modal

Made by

  • Kyle Fox

Github activity

  • 1549 stars
  • 83 watchers

About the plugin

jQuery Modal

A simple & lightweight method of displaying modal windows with jQuery.

Demo image: Animated Modal

Made by

  • João Pereira

Github activity

  • 842 stars
  • 43 watchers

About the plugin

Animated Modal

animatedModal.js is a jQuery plugin to create a fullscreen modal with CSS3 transitions. You can use the transitions from animate.css or create your own transitions.

Demo image: jQuery Popup Overlay

Made by

  • Vast Engineering

Github activity

  • 439 stars
  • 71 watchers

About the plugin

jQuery Popup Overlay

jQuery plugin for responsive and accessible modal windows and tooltips.

Demo image: bPopup

Made by

  • dinbror

Github activity

  • 427 stars
  • 48 watchers

About the plugin

bPopup

bPopup is a lightweight jQuery modal popup plugin (only 1.34KB gzipped). It doesn’t create or style your popup but provides you with all the logic like centering, modal overlay, events and more. It gives you a lot of opportunities to customize so it will fit your needs.

Demo image: OmniWindow

Made by

  • Alexander Rudenka

Github activity

  • 112 stars
  • 8 watchers

About the plugin

OmniWindow

OmniWindow – extremely customizable modal plugin for jQuery.

Demo image: Zebra_Dialog

Made by

  • Stefan Gabos

Github activity

  • 98 stars
  • 22 watchers

About the plugin

Zebra_Dialog

A small, compact, and highly configurable jQuery plugin for creating modal dialog boxes.

Demo image: jquery-plainModal

Made by

  • anseki

Github activity

  • 70 stars
  • 4 watchers

About the plugin

jquery-plainModal

The simple jQuery Plugin for fully customizable modal windows.

Demo image: Accessible Modal Dialog

Made by

  • Scott O’Hara

Github activity

  • 60 stars
  • 4 watchers

About the plugin

Accessible Modal Dialog

jQuery a11y modal window.

Demo image: SweetModal

Made by

  • Adepto.as

Github activity

  • 56 stars
  • 10 watchers

About the plugin

SweetModal

Sweet, easy and powerful modals using jQuery. Replace alert(), confirm(), prompt() and many plugins with style and elegance.

Demo image: Modal

Made by

  • Michał Buczko

Github activity

  • 55 stars
  • 4 watchers

About the plugin

Modal

jQuery plugin to create modal windows.

Demo image: Focus

Made by

  • Elkfox

Github activity

  • 4 stars
  • 4 watchers

About the plugin

Focus

A minimal popup, modal, notification, overlay, drawer and dialogue window plugin.

Demo image: Modal Box

Made by

  • WebGadgets

Github activity

  • 0 stars
  • 1 watchers

About the plugin

Modal Box

The plugin Modal Box helps you to create a window that pops up in front of other elements on your page. It can be used for advertisements, subscription form, uploading forms, login/register forms or for displaying a simple message to the visitor.

Leave a Reply

Your email address will not be published.