Best jQuery Plugin & Tutorial of December, 2012

Google Map Instant Search in jQuery

Google Map Instant Search in jQuery

Today  i  created a new looking “Google Map Instant Search” with simple  jquery and j-son script ,by using Google’s API and by using instant search function keyup(function(e)) this will started to display the places as you type the results on the search box with simple and neat  user interface and easy to search .

hoverOver : jQuery Plugin for Adding Hover Content

hoverOver : jQuery Plugin for Adding Hover Content

“hoverOver” plug-in is useful for showing content on image or text blocks to show short information related to product, image etc. Plug-in provides various animation effects to show content.

Features:

  • Hover over content can be defined on text content or image
  • You can define content text either in contentData or define data-content=’#contentID’ and define content inside Hover Content Goes Here
  • 14 different animation styles
  • 5 styles for show content e.g. fly, curtain, push, pull, tocenter/fromcenter
  • Content can be half visible using contentShowHeight. (e.g. Can be used with “flytop” & “flybottom”)

Create A jQuery Twitter Feed Plugin

Create A jQuery Twitter Feed Plugin

n the following tutorial we are going to go show how to create a jQuery plugin to display Twitter feeds via AJAX from either a username or search using the Twitter API.

The plugin will also include code to display time since posted, retweet, reply & favourite links plus options to set the number of feed items to display, turn on/off retweets and replies, show the user’s avatar and also include any embedded images.

jQuery.waiting : A plugin to wait fixed time since the last call only

jQuery.waiting : A plugin to wait fixed time since the last call only

jQuery.waiting is a timer that takes into account only the last call.Having a little trouble to explain the principle, I prefer to show you through the following example adds the text in a list entry 1s after typing the last letter

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)

jQuery Form Remember State plugin

jQuery Form Remember State plugin

When called on a form element, localStorage is used to remember the values that have been input up to the point of either saving or unloading. (closing window, navigating away, etc.) If localStorage isn’t available, nothing is bound or stored.

By default, the plugin looks for an element with a class of remember_state within the form to show a note indicating there is stored data that can be repopulated by clicking on the anchor within the remember_state container. If the element doesn’t exist, it is created and prepended to the form. You can override the selector and the HTML that is prepended in the options object you pass to the plugin.

jQuery Image Animation Trick With Mouse Position

jQuery Image Animation Trick With Mouse Position

In this short tutorial post, I create a simple code in jquery to creating an animation look a like effect, that triggered by mouse cursor position. This trick can be used for animating photo profile, with changing the image source on html element or in this case I change the class value.

tinycon : A Small JavaScript library for manipulating the favicon

tinycon : A Small JavaScript library for manipulating the favicon

A small library for manipulating the favicon, in particular adding alert bubbles and changing images. Tinycon gracefully falls back to a number in title approach for browers that don’t support canvas or dynamic favicons.

Alerts in the favicon allow users to pin a tab and easily see if their attention is needed.

Geolocation : A jQuery plugin to Get Location of your users

Geolocation : A jQuery plugin to Get Location of your users

Include this jquery plugin to get the location of the users visiting your webpage.This plugin displays the complete address, latitude and logitude of the user in a div and also displays the location found in a Google map.

jQuery Responsive Horizontal Layout with CSS3

jQuery Responsive Horizontal Layout with CSS3

Today we want to show you how to create a horizontal layout in jQuery and CSS3 with several content panels. The idea is to make each panel individually scrollable and animate a content panel to the left of the viewport once it’s clicked or selected from the menu. The challenge is to deal with different viewport sizes meaning that we will change the layout if the screen is not wide enough in order to be stacked vertically instead of horizontally.



Best jQuery websites design awards