JQuery is one of the most popular cross platform JavaScript
library which is designed for simplification of client side scripting of HTML.
JQuery is the free, open source and its syntax is designed in such a way that
it makes easier to navigate a document, creating animations, handle events and
develop AJAX applications as well. As more people started navigating towards
the online business, there is a need to create some dynamic pages on web
considering the advance level functionalities, animations and high level theme
widget areas. This is where jQuery comes into play and satisfies all the needs
to create some unique dynamic pages as well as web applications.
We all know jQuery is a fast and concise JavaScript Library that
simplifies HTML document traversing, event handling, animating and also Ajax
interactions for rapid web developments. JQuery is specially designed to change
the way that we write JavaScript.
Now to understand jQuery Plugin, you need to define the term
'Plugin'. Plugin is actually set of software components and sometimes it may be
very small in size and it adds specific abilities to a larger software
application. Some plugins supports customizing functionality that let us get
the full benefits and jQuery Plugins has this functionality.
The day by day growing jQuery community has created
thousands of plugins from small selector helpers to full scale UI
widgets.
Why Plugins?
Some of the main reasons include:
> It enable third-party developers to create abilities which
extend an application
> To support easily adding new features
> Sometimes, to reduce the size of an application
> Sometimes, to separate source code from an application
How
to attach plugins in project?
The use of jQuery plugins is very straightforward, we just
need to download the plugin codes (.js files) and place it with your .js files
in the project directory. If you remember the use of jQuery library files, we
can either use the .js file place on different server or we can download .js
file and place it in project directory. The same technique we can use there
with plugins. I personally never use the different server for this; I just
download one copy for my server because I can’t depend on other server’s
uptime.
You may also create your own jQuery plugins and release them into the jQuery market, if you feel like there is no plugin that exists, solving your purpose. We can extend a jQuery prototype object using these plugins, enabling all jQuery objects to inherit any methods that you add. This article will give you a brief about the 20 Amazing jQuery Lightbox Plugins released in, or before for 2014 and 2015
------------------------------------------------------------------------------------------
1. Lighterbox
Lighterbox is a lighterweight and customizable jQuery lightbox gallery plugin. A simple plugin supporting modern mobile and desktop browsers to minimize configuration and hacky code.
2. Rebox
jQuery-Rebox is a simple, lightweight, responsive and mobile friendly jQuery lightbox plugin.It’s simple and do not require any images.
3. LiteBox
LiteBox is a versatile, auto detecting content, lightbox/modal window for use with images, embedded content (YouTube, Vimeo, Daily Motion and KickStarter), iframes and inline html.
4. lightGallery
jQuery lightGallery is a lightweight jQuery lightbox gallery for displaying image and video gallery. It has myriad of features such as responsive layout, touch support for mobile devices, slide and fade effects, image captions and descriptions and many more.
5. Image Lightbox
Image Lightbox is a ascetic, minimalistic, extensible & configurable, responsive and touch-friendly, iOS, Android and Windows Phone compatible lightbox plugin. Silently preloads next image, uses CSS transform and transition, interacts with keyboard.
6. jQuery TosRus
jQuery.TosRUs plugin is a great lightbox alternative forscrolling/swiping through any kind of content. On a desktop, tablet or smartphone, inside a HTML element or as a lightbox popup. It’s responsive by default.
7. Fluidbox
Fluidbox is a jQuery plugin that replicate the distraction-free, fluid lightbox seen on Medium, and to improve on it such that it will allow linking to a larger-resolution image. It works on mobile and also plugin deals with higher resolution, linked images elegantly, such that it only preloads them when users click on the thumbnails.
8. Swipebox
Swipebox is a jQuery lightbox plugin that has support for touch events and works well in responsive layouts. It can display a single item or a group of items (gallery) where they can be browsed with swipe gestures or keyboard too.
9. iLightbox
iLightBox is a fresh alternative to other jQuery lightbox plugins and there is a strong chance that, although it is a paid resource, it may become your favorite. It can present images, videos (YouTube, Vimeo, HTML5 video), other HTML and there is an optional fullscreen mode.
10. VenoBox
VenoBox is a just another responsive jQuery lightbox plugin, suitable for images, inline contents, iFrames, Google-Maps, Ajax requests, Vimeo and YouTube videos. The big difference compared to many others modal-window plugins is that VenoBox calculates the max width of the image displayed and preserves its height if is taller than the window (so in small devices you can scroll down the content, avoiding vertical microscopic resized images).
11. Magnific Popup
Magnific Popup is a free responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device. The majority of lightbox plugins require you to define size of it via JS option. Magnific Popup does not – you can use relative units like EM’s or resize lightbox with help of CSS media queries. Update content inside lightbox without worrying about how it’ll resize and center.
12. Featherlight
Featherlight is a very lightweight jQuery lightbox. It isresponsive, supports images, ajax and iframes out of the box and range of configuration options, you can adapt it to your needs.
13. flipLightBox
flipLightBox is a free responsive lightbox jQuery plugin that is extremely easy to implement and doesn’t require any additional stylesheets, scripts or libraries. Its main feature is an optional flip effect as each lightbox image opens and closes. Another optional feature is a toggled slide text bar and navigation to accompany the lightbox images.
14. Colorbox
ColorBox is a jQuery Lightbox plugin which is lightweight (9kb) & supports photos, photo groups, slideshow, ajax, inline, and iframed content. The lightbox has a very nicely designed interface which can be improved or customized with CSS. ColorBox is unobtrusive; every option is mentioned in the JS & requires no changes to the existing HTML.
15. Lightbox_me
Lightbox_me is an essential tool for the jQuery developer’s toolbox. Feed it a DOM element wrapped in a jQuery object and it will lightbox it for you.
16. Shadowbox
Shadowbox is a lightbox plugin that supports all of the web’s most popular media publishing formats. Shadowbox is highly customizable and website authors can showcase a wide assortment of media in all major browsers without navigating users away from the linking page. Shadowbox is free for non-commercial use.
17. Superbox
SuperBox is a new jQuery plugin that takes the whole ‘image’ and ‘lightbox’ one step further, reducing the JavaScript and image load dependence to make lightboxing a thing of the past! Using HTML5 data-* attributes, responsive layouts and jQuery. SuperBox works wonders as a static image gallery, which you can click to reveal a full version of the image.
18. Lightview
Lightview 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, Lightview aims to push the Lightbox concept as far as possible. Lightview uses HTML5 to help you deliver the best experience across every browser. Let it enhance your media automatically or create custom overlays using the powerful Javascript API.
19. Fresco
Fresco is a beautiful responsive lightbox that can be used to create stunning overlays that work great at any screen size, in all browsers on every device. To make things even more awesome Fresco comes with fullscreen zoom, retina-ready skins, Youtube and Vimeo integration for HTML5 video and a powerful Javascript API.
20. Topup
TopUp is an easy to use Javascript library for unobtrusively displaying images and webpages in a Web 2.0 approach of popups. The library is jQuery and jQuery UI driven in order to maintain cross-browser compatibility and compactness.
No comments:
Post a Comment