Best jQuery Popup Window Plugins & Tutorials with Demo

    jQuery Animated UI Modal with CSS3

    jQuery Animated UI Modal with CSS3

    jQuery UI Modal is plugin of jQuery UI. It easy to create modal functionality to the web application (example the modal form …) and to replace the basic functionality provided by the standard javascript alert(), confirm(), and prompt() functions.

    Features:

    • Easy to use.
    • Plugin for jQuery UI .
    • open the modal after x milliseconds.
    • Support 2 effect and all type of easing.
    • Form elements.
    • Image support.
    • Button support.
    • CSS3 animate support.
    • 3 callback function onStart | onShow | onClose

    Nivo Zoom : jQuery Image Zoomer Plugin

    Nivo Zoom : jQuery Image Zoomer Plugin

    Nivo zoom is jQuery plugin for image zooming

    Features:

    • 5 different zoom types
    • Optional overlay support
    • Supports HTML captions
    • Simple clean & valid markup
    • Loads of settings to tweak
    • Packed version only weighs 4kb
    • Free to use and abuse under the MIT license

    Smart Notification : jQuery Plugin

    Smart Notification : jQuery Plugin

    Smart Notification is a jQuery plugin. It is an advanced pop-up notifications. With the ability to add video.

    Features:

    • Supports Video
    • Sound Effect
    • Toggle Mode
    • Opens Like Lightbox
    • Adaptive in Lightbox Mode
    • Cross Browser Even IE 7
    • Simple to Use
    • Timeout Mode
    • Allow multiple connections

    FaceBox, The Lightbox Connected on All! with jQuery

    FaceBox, The Lightbox Connected on All! with jQuery

    This lightbox will leave your site connected to all social networks. With the facebook comments plugin, all users can interact with your page. After all, there are buttons for sharing to other networks such as Facebook, Google Plus, Twitter, LinkedIn, Pinterest. This lightbox will open any type of content, images, text, iframes, ajax content, videos, youtbube, vimeo and flash.

    Expanding Overlay Effect with CSS clip & jQuery

    Expanding Overlay Effect with CSS clip & jQuery

    A tutorial about how to create a simple expanding overlay effect using the CSS clip property and CSS transitions. In this tutorial we want to explore the practical side of it a little bit more. We are going to create a neat and simple effect for revealing some extra content and expanding a fullscreen overlay.

    We want to show how to leverage the CSS clip property to make a smooth transition when clicking on a box element. The idea is to show some kind of overlay as if it’s actually underneath the respective element. Clicking an element will create a cut-out effect, revealing another layer that will expand.

    Responsive Slideshow Photo Gallery Grid with Html5

    Responsive Slideshow Photo Gallery Grid with Html5

    The Responsive Slideshow Photo Gallery has a fluid / flexible / responsive layout. Basically the grid is added into a html page into a div of your chosing and it’s adapting based of that div’s width, the grid height is modified based on the number of thumbnails and if other elements are below the grid div they will be pushed down automatically (document flow). In the examples provided you can see a few ways in which you might use this grid, of course that other configurations are possible.

    Pure OOP JavaScript code, no usage of jQuery or other libraries, in this way there will be no incompatibilities with HTML pages that might be using jQuery or other JavaScript libraries.

    The Responsive Slideshow Photo Gallery is using the GPU (hardware acceleration) using HTML5 standards. The rendering speed and performance is impeccable on desktop computers and most importantly on mobile devices, the way it works it will try to use CSS3 and if this is not available it will down fall to CSS2 or CSS1 for older browsers like IE7 and IE8.

    Megafolio Pro Responsive Grid jQuery Plugin

    Megafolio Pro Responsive Grid jQuery Plugin

    Megafolio Pro is a fully responsive media grid plugin that allows you to display content in almost every way possible using preset or randomly generated layouts. Dive right into the action by taking a look at our previews, showcasing just a few examples of whats possible with Megafolio Pro!

    Features:

    • Tons of options
    • Fully Responsive & Mobile Optimized (Smartphones & Tablets)
    • Customizable Grid Layouts
    • Various Transitions & Effects
    • Category Filter Styles
    • Fast CSS3 & jQuery Engine
    • The Perfect Solution for all Grid Based Applications
    • Fancybox 2 Lightbox Plugin

    iLightBox : jQuery Revolutionary Lightbox Plugin

    iLightBox : jQuery Revolutionary Lightbox Plugin

    iLightBox allows you to easily create the most beautiful overlay windows using the jQuery Javascript library.By combining support for a wide range of media with gorgeous skins and a user-friendly API, iLightBox aims to push the Lightbox concept as far as possible.

    Features:

    • Responsive design.
    • 6 ready to use skins.
    • Native browser fullscreen support.
    • Cross browser, supports Chrome, FireFox, Safari, Opera and IE7+
    • Device friendly, works in iPhone, iPad, Android Devices and Windows Phone.
    • Fully customizable, it’s possible to customize or redesign all parts of iLightBox.
    • Search engine optimized (SEO)
    • Youtube and Vimeo videos are supported.
    • Video auto recognition from sites.
    • Smart Content recognizer
    • Option to preview thumbnail over navigation.
    • Smart resource loader
    • Simple clean & valid markup
    • Developed with pure object oriented javascript
    • Multilanguage support
    • Keyboard support
    • Touch support
    • Mouse support: (Click, Wheel)

    Photobox: CSS3 image gallery jQuery plugin

    Photobox: CSS3 image gallery jQuery plugin

    Photobox is a lightweight image gallery modal window script which uses CSS3 heavily for silky-smooth animations and transitions. The goal was to great an image gallery script that utilizes GPU rending instead is the 90% scripts out there which are using javascript to move things around the old fashioned way.

    Benefits:

    • Both the script & CSS are only 7k each (minified script, not gziped)
    • Uses silky-smooth, hardware accelerated, CSS3 transitions and animations (for better performance)
    • Pretty UI and easy UX
    • CSS3 preloader, tailored-made. The only image you need is the arrow.png (soon even not that)
    • Works also on IE9 and above, but clearly not as nice as in normal browsers
    • Uses event-delegation on all thumbnails events

    jQuery Speedo Popup

    jQuery Speedo Popup

    Speedo Popup is a small, powerful and real customizable jQuery plugin. Speedo Popup is not just a popup, Speedo Popup is:

    • a Popup Plugin
    • a Notification Plugin
    • a Lightbox Plugin
    • an Alert Box Plugin

    And that’s not all.

    You can play videos, you can make a light box of videos and mixed content or you can notify the user when you want, you have the possibility to do whatever you want.It has full compatibility for HTML5 and full fallback for older browsers.