Ladda : JavaScript Loading Indicators with CSS3

Ladda : JavaScript Loading Indicators with CSS3

Buttons with built-in loading indicators, effectively bridging the gap between action and feedback.A UI concept which merges loading indicators into the action that invoked them. Primarily intended for use with forms where it gives users immediate feedback upon submit rather than leaving them wondering while the browser does its thing.

jQuery Amazing Portfolio – WordPress Plugin

jQuery Amazing Portfolio - WordPress Plugin

Features:

  • Create Fully responsive portfolios
  • Control the number of columns for various screen resolutions and widths.
  • 25 unique and creative theme effects (More coming soon)
  • Unlimited colors and style.
  • Manage Unlimited Portfolios.
  • Control cross browsers CSS effects of various elements like borders, backgrounds, fonts, paddings, margins, alignments, colors, shadow etc.
  • Based on powerful Mixitup plugin
  • Images, video and audio support for portfolios
  • Fully customizable CSS and Style settings. Possible to customize or redesign all parts of portfolio from panel.
  • Responsive lightbox supports any media type like audio, video, external video, images, embeded codes and HTML codes.
  • Auto detect media in lightbox and keyboard support navigation
  • Control animation easing, animation effects and animation speed
  • Filterable portfolio with controllable animations.
  • 25 brilliant inbuilt demos
  • Create Audio file or Video file portfolio using default browser players

jQuery Sliding Pop Hover Plugin

jQuery Sliding Pop Hover Plugin

jQuery plugin Sliding a div over other div on mouse hover.Move the cursor arround the image bellow to make other side of the display item appear which is hidden with the effect of sliding that is where the power of Sliding Pop Hover plays role. The Sliding Pop Hover makes the other part which is hidden slide into the picture slowly when the cursor is on top of the view and plays reverse role when cursor leaves the view.

jQuery Bootstrap-style Dropdowns

jQuery Bootstrap-style Dropdowns

Bootstrap-style dropdowns in jQuery with some added features and no dependencies.

One of my favorite Boostrap plugins is dropdowns, but I had a bit of difficulty getting started with them. The docs say you can apply a dropdown to nearly any element, but they really seem to work best with Bootstrap’s navbar, tab, and pill components. Since I was retrofitting an app that was around long before Bootstrap, this wasn’t going to work for me. That and I was hoping to get a scrollable dropdown (with tips!) and a few other features out of the deal. Thus, this plugin was born.

jQuery Adaptive Backgrounds Plugin

jQuery Adaptive Backgrounds Plugin

A simple jQuery plugin to extract the dominant color of an image and apply it to the background of its parent element.

Exploding Blocks with CSS and Javascript

Exploding Blocks with CSS and Javascript

Ever wanted to make your HTML blocks explode when it’s clicked or touched? Well I did, and today I’m going to show you how I went about doing it. We’re mainly using CSS, but that’s all being run by Javascript just for ease. Read on to learn how it was done!

So I was kind of inspired by this little gif I saw that had a block explode when it was clicked, and I thought that was really cool. So I started thinking, how would you do that with CSS and maybe some Javascript? Well I figured it out using a bit of math, and it functions as a pretty cool delete button.

DictAndList : jQuery plugin for editable Dict and List html

DictAndList : jQuery plugin for editable Dict and List html

It is a plugin for editable Dict and List html, their values can be attached into form as stringified JSON when processing jQuery post.

Infographic Charts and Graphics HTML Tags Library

Infographic Charts and Graphics HTML Tags Library

This custom JS charting library created by PSDDude from 0 implements custom HTML tags which allow creating charts and graphs for infographics.

It is a light-weight, pure JavaScript charting library (NO jQuery or other libraries required) which makes use of HTML5 technologies and works on all modern browsers including IE, Chrome, Firefox, Opera, Safari.To use it you do not need to know any JavaScript, as all the charts are added as HTML tags. You can follow the very straight forward documentation which also contains examples.

The library allows creating: – Piecharts and doughnuts – Shape graphs – you can transform any image(PNG) into a graph – Shape bar graphs – use any image (PNG) to construct a bar chart – Line graphs – Barchart graphs

jQuery Draggable Background Plugin

jQuery Draggable Background Plugin

A jQuery plugin to make background images draggable.

Facebook Style Search Friends using jQuery

Facebook Style Search Friends using jQuery

In this tutorial I have used jQuery to search friends like facebook style. With just a few lines of jQuery code and a small text input box you can add a search members / users / friends to any web projects.Previously I published the tutorial like live text search using jQuery.

Also I have used javascript RegExp function to performs case insensitive search.

The jQuery code for this trick is really easy and all we are doing is basically getting the input text value from the search box & checking that value against our list of friends in the “friendslist” div and showing those friends matches the searched keyword. The count of the number of matched friends is then displayed in our “result_area” div tag.