Browsing

June 6, 2013 jQuery no responses # , , ,

Pop Easy – Lightweight Modals For jQuery

Pop Easy is a jQuery plugin for quickly creating completely customizable modals. Regarding the design, the default modal already has a good-looking interface and it can be changed/improved with CSS.

jQuery Modal Box Plugin - Pop Easy

There are options for customizing the animation used when the modal appears, its speed, the opacity, if it’ll be opened onLoad and more. Considering the size, the plugin is very useful. One thing seems to be missing for now is the built-in ability to load remote data (Ajax).

The plugin is lightweight (2kb) and has support for displaying any HTML element, including videos.

Requirements: jQuery
Compatibility: All Major Browsers
Website: http://thomasgrauer.com/popeasy/
May 15, 2013 jQuery no responses # , , ,

Windows – Scrolling Pages Nicely With jQuery

Windows is a lightweight jQuery plugin for nicely scrolling the full-screen. It provides a simple and handy API for managing the page/content position to ease the browsing experience.

The plugin can analyze if a defined content is in the viewport, how much of it is in the viewport and can trigger any actions like focusing the page to the content by scrolling it.

Windows - jQuery Plugin

Requirements: jQuery
Compatibility: All Major Browsers

Website: http://nick-jonas.github.io/windows/
Download: https://github.com/modernassembly/windows/

May 7, 2013 jQuery no responses # , , , , ,

MixItUp – A Nice jQuery Plugin For Filtering And Sorting Items

MixItUp is another great plugin to handle such tasks that deserves to be bookmarked. There are various jQuery plugins for filtering and sorting elements where the most popular ones are Isotope and Quicksand.

While jQuery part decides which elements to show or hide, CSS3 transitions are used for animating them.

jQuery Filtering Plugin - MixItUp

The plugin plays nice with responsive + fluid layouts it is lightweight and works pretty fast. There are many options for customization: effects, easing, their speed, etc. and it is very well-documented.

Requirements: jQuery
Compatibility: All Modern Browsers

Website: http://mixitup.io/
Demo: http://mixitup.io/demos/cards
Download: https://github.com/barrel/mixitup

April 3, 2013 jQuery no responses # , , , ,

Draggabilly – Standalone JS Library For Drag & Dropping Elements

Draggabilly – a standalone and lightweight JavaScript library for “Draggable” and “Droppable”  elements.

Draggabilly

The element to be dragged can be limited to have that feature in a container and there are callbacks on each event (start, move, end) which can also return the position/location of the item.

It works in all modern browsers (IE8+) and there is built-in support for touch events.

Requirements: No Requirements
Compatibility: All Modern Browsers

Website: http://draggabilly.desandro.com/
Download: http://github.com/desandro/draggabilly

February 11, 2013 HTML5 , jQuery no responses # , , ,

iLightBox – Impressive jQuery Modal Box Plugin

Modal boxes are so functional in displaying any HTML content with a focused interface and there are many great ones around.

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.

Continue reading

February 4, 2013 CSS no responses # , , , , ,

CSS-Only Tooltips With Hint.css

Tooltips are usually created and triggered with JavaScript. But, CSS is now powerful enough to handle a simple tooltip functionality itself. Hint.css is a tooltip library that is built with SASS and only uses CSS + HTML.

The library uses 

data

attribute,

content

property, pseudo elements and CSS3 transitions.

Hint.css

Tooltips are simple-yet-good looking, has arrows and can be positioned on any side of the parent element.

And, they don’t have to be visible onlyВ when hovered but can be set as “always showing” too.

Compatibility: All Modern Browsers

Website: http://kushagragour.in/lab/hint/
Download: https://github.com/chinchang/hint.css

December 3, 2012 JavaScript , jQuery no responses # , , , , ,

Hammer.js – Touch Gestures With JavaScript

Hammer.js is a JavaScript library for adding touch gestures support to any website so that users can interact with them easier on touch devices.

Continue reading

December 3, 2012 JavaScript , jQuery no responses # , , , ,

qTip2 – Advanced jQuery Tooltip Plugin

qTip2 plugin can display the tooltip in any position wanted, plays nicely with image maps and they can be set to follow any element (handy for drag 'n' dropped and animated items) or mouse. Tooltips are tiny user interface elements which are very useful in displaying information "on request" without breaking the attention/focus.

qTip2 - jQuery Tooltip Plugin

Tooltips can be styled completely, there is an optional Themeroller support and they can even be displayed as modal windows. It has built-in Ajax integration and can load any remote data. qTip2's website has lots of creative demos including 3rd part service and various popular plugin integrations.

The download package can be customized to Еџnclude only the features needed and a converter exists for upgrading from the 1st version.

Download: http://craigsworks.com/projects/qtip2/

December 3, 2012 jQuery no responses # , , , , ,

mlens – A Slick jQuery Magnifying Glass Plugin

Magnifying glass interfaces are pretty useful for enabling users to zoom in to images so that details can be viewed without loading a bigger version. mlens, a tiny jQuery plugin (~1kb minified and gzipped), simplifies creating this magnifying glass functionality so much.

mlens jQuery zoom plugin

It comes with few parameters like the shape of the lens (circle or square), lens size and the options for customizing the border. Multiple instances of it can be used in the same page and a WordPress plugin for it is being developed.


Requirements: jQuery
Compatibility: All Major Browsers

Website: http://mlens.musings.it/

December 3, 2012 jQuery no responses # , , ,

FooTable – Responsive Tables Made Smarter

There are many ways to serve each web element in responsive layouts. For HTML tables, FooTable (a jQuery plugin) comes with a great approach without breaking the functionality and design.

The plugin auto-hides the selected columns on each breakpoint defined and users won’t need to scroll horizontally.

Continue reading

Pin It on Pinterest