iView Slider : Responsive jQuery Slider Plugin

iView Slider is a responsive jQuery slider plugin for image slider.

Aviaslider - unique jQuery slideshow plugin

Aviaslider is a unique slideshow plugin with several transition effects.

jWindowCrop : For facebook like image cropping

jWindowCrop is jQuery plugin for easy zoom and pan image cropping.

Digicrafts - Thumbnail Gallery jQuery Plugin

Digicraft is a jQuery plugin to display thumbnail gallery with XML support.

RefineSlide : jQuery Slider Plugin

RefineSlide is a slider with CSS transition and 3D trasnform support.

Monday, December 31, 2012

ClassyBox : Complex jQuery LightBox Alternative

ClassyBox is a jQuery plugin that is a complex LightBox alternative with support for the most popular video services, enabling you to embed a media gallery on your site.
ClassyBox : Complex jQuery LightBox Alternative
ClassyBox
Features:
  • Embeds Photo Galleries.
  • Support for video.
  • Responsive layout.
  • Social Media buttons – Facebook, Twitter and Google+ – redirect link to ClassyBox window.
  • Button to set original size.
  • Possibility to add preloader for photo galleries.
  • Possibility to add an image to player.
  • AJAX support.
  • Possibility to show adds on top of the content.
  • Keyboard support.
  • Easy to change the appearance via CSS.
  • Support for YouTube, VIMEO, DailyMotion, 5min, MetaCafe, Ustream, Hell TV, VEVO and MySpace.
Home : ClassyBox Home
Demo : ClassyBox Demo

Sunday, December 9, 2012

X-editable : Plugin for in-place editing

X-editable allows you to create editable elements on your page. It can be used with any engine (bootstrap, jquery-ui, jquery only) and includes both popup and inline modes. It makes development faster and easy. It doesnot require any special FORM markup. Backend script for data update is simple.
X-editable : Plugin for in-place editing
X-editable

Thursday, November 15, 2012

Kwicks for jQuery – Sexy Sliding Panels

Kwicks for jQuery is a plugin providing sexy sliding panels with an emphasis on navigational interaction. Kwicks was originally a port of a MooTools effect (of the same name), but has since evolved into a highly configurable and versatile UI component. Lots of customization options are available in the plugin.
Kwicks for jQuery – Sexy Sliding Panels
Kwicks for jQuery

Wednesday, November 14, 2012

jQuery 1.8.3 released

The jQuery team has released version 1.8.3 of the popular JavaScript library jQuery. Previous version of 1.8.2 was released in September 20, 2012. There is no any major changes but lots of minor bugs and regressions are resolved and cleaned. According to official blog, jQuery team is working hard to remove bugs as much as possible since 1.9 version is going to of grand  release with major changes in jQuery library.
Download jQuery : download

jQuery BlackAndWhite : jQuery plugin to convert colored image to B&W grayscale

jQuery.BlackAndWhite is a simple plug-in to easily convert any colored image into a B&W greyscale image. It uses the the HTML5 canvas tag and a fallback for the old browsers. Plugin has several options for customization like hoverEffect, webworkerPath, responsive, invert HoverEffect and also speed.
jQuery BlackAndWhite : jQuery plugin to convert colored image to B&W grayscale
jQuery BlackAndWhite

Friday, November 9, 2012

CLEditor : lightweight and extensible WYSIWYG HTML editor jQuery plugin

CLEditor is an open source jQuery plugin which provides a lightweight, full featured, cross browser, extensible, WYSIWYG HTML editor which can be easily added into any web site. CLEditor consumes less than 9K of total bandwidth when minified and gzipped. In addition to the standard text formatting features found in other WYSIWYG editors, CLEditor also contains rich drop downs for font name, size, style, text color and highlight color. CLEditor allows you to insert images, hyperlinks and horizontal rules. CLEditor supports the following browsers on both the mac and pc: IE 6.0+, FF 1.5+, Safari 4+, Chrome 5+ and Opera 10+. All testing is done using jQuery 1.4.2. It is also extensible as it provides a rich plugin development environment, allowing you to customize its user interface and functionality to fit your needs.
CLEditor : lightweight WYSIWYG HTML editor jQuery plugin
CLEditor
Home : CLEditor Home Page
Demo : CLEditor Demo

Tuesday, November 6, 2012

jQuery for Dummies - ebook download free

jQuery for Dummies
jQuery for Dummies is a book on jQuery javascript library in Dummies series. This free ebook ready for download will help you dig deeper into jQuery even if you are not much in javascript or programming. jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript. It allows you to extend and customize Joomla!, Drupal, AJAX, and WordPress via plug-ins. Assuming no previous programming experience, Lynn Beighley takes you through the basics of jQuery from the very start.

You will discover how jQuery makes your life easier and how the jQuery library separates itself from other JavaScript libraries through its ease of use, compactness, and friendliness if you're a beginner programmer. From the book title, you can assume that it is written in the easy-to-understand style of the For Dummies brand This book demonstrates how you can add unique and exciting interactivity to a Web site or WordPress blog, including photo browsers, menus, tab-based navigation, sliding sidepanels, slideshows, transition effects, fade effects and a lot more.

Download : jQuery for dummies

Monday, November 5, 2012

Crumble : jQuery plugin for interactive tour for your website or app

Crumble is a jQuery plugin for quirky, interactive tour for your website or app. Crumble allows you to quickly and easily build feature tours for your website or app using small bubbles. The bubbles are visually interesting, will draw attention and due to the small size make sure that you will write using concise language that visitors will read. The tour itself is defined as a standard ordered list in your html, making it accessible.
Crumble : jQuery plugin for interactive tour for your website or app
Crumble

Tuesday, October 30, 2012

Quake Slider : jQuery Image Slider Plugin with Cool Transition Effects

Quake Slider is a jQuery based image and content slider with some cool animations effects with some of them being very unique. Like SwirlFadeIn, SwirlFadeOut and more. With this slider you can combine images with short summary/caption that helps you optimize contents for search engines and make SEO easy for you. You can also link your images to open detail for particular slide/image. You have complete control over not just the orientation of each caption but you can also control the animation for each caption and provide different animations for each of the slides using callbacks.
Quake Slider : jQuery Image Slider Plugin with Cool Transition Effects
Quake Slider

10 Excellent Free jQuery Star Rating Plugins

Ratings are very popular nowadays. Rating is done for the evaluation or assessment of quality or standard of something. Here is a collection of some nice jQuery rating plugin which will save some of web developers.
  1. jRating : Very flexible jQuery plugin for creating quickly a star rating system
    jRating is a very flexible jQuery plugin for quickly creating an Ajaxed star rating system. It is possible to configure every details from "the number of the stars" to "if the stars can represent decimals or not". There is also an option to display small or big stars and images can be changed with any other file easily.
    jRating : Very flexible jQuery plugin for creating quickly a star rating system
    jRating
  2. RateIt : a jQuery star rating plugin
    RateIt plugin is a star rating plugin for jQuery. Fast, Progressive enhancement, customizable (just swap out the images, or change some CSS), Unobtrusive JavaScript (using HTML5 data-* attributes), RTL support, supports as many stars as you'd like, and also any step size.
    RateIt : a jQuery star rating plugin
    RateIt
  3. jQuery Star Rating Plugin
    The jQuery Star Rating Plugin is a plugin for the jQuery Javascript library that creates a non-obstrusive star rating control based on a set of radio input boxes. It turns a collection of radio boxes into a neat star-rating control. It creates the interface based on standard form elements, which means the basic functionality will still be available even if Javascript is disabled.
    jQuery Star Rating Plugin
    jQuery Star Rating Plugin
  4. Star Rating Plugin for jQuery
    Star Rating plugin is easy to use rating control system. It takes a normal select box, and turns it into a rating that your users can click on. The select box is preserved so you can still bind on change, get, and set the value in the rating control. The image is controlled with CSS and a simple gif, so you can make it look like anything you need.
    Star Rating Plugin for jQuery
    Star Rating Plugin for jQuery
  5. jQuery Star Rating Plugin beta
    jQuery Star Rating Plugin beta is quick and simple star rating plugin for jQuery. This is a fully degradable plugin that creates the Star Rating interface based on a simple form structure. It has support for keyboard navigation.
    jQuery Star Rating Plugin beta
    jQuery Star Rating Plugin beta
  6. jQuery Simple Half-Star Rating Plugin
    This is a jQuery plugin for star rating systems. The initial inspiration for this script came from Wil Stuckey's star rating system. But the original script requires too much coding. Also it does not have provision for developing a star system (such as GMail, where you star or un-star an email).
    jQuery Simple Half-Star Rating Plugin
    jQuery Simple Half-Star Rating Plugin
  7. Star Rating (jQuery Plugin)
    You can reveal pretty rating stars by this plugin. This plugin working fast because there is no user options. Just include and call it. If you would like store votes in a database then you must use callback method.
    Star Rating (jQuery Plugin)
    Star Rating (jQuery Plugin)
  8. jQuery Rater Plugin for Star Ratings
    This rating plugin is a neat control to add in your website. It has many options that allow you to easily customize it. However, it's usage is based on a fully degradable form submission model which means you must use markup containing an option list.
    jQuery Rater Plugin for Star Ratings
    jQuery Rater Plugin for Star Ratings
  9. Unobtrusive AJAX Star Rating Bar
    Unobtrusive AJAX Star Rating Bar is a jQuery plugin for star rating system which worls unobtrusively. That means if Javascript is off it will still work (although the page will refresh).You can also set the number of rating units you want to use.
    Unobtrusive AJAX Star Rating Bar
    Unobtrusive AJAX Star Rating Bar
  10. jQuery Raty - A Star Rating Plugin
    jQuery Raty is a nice and elegant star rating plugin developed on jQuery javascript library. It generates customizable stars automatically.
    jQuery Raty - A Star Rating Plugin
    jQuery Raty - A Star Rating Plugin

Saturday, October 27, 2012

PFold jQuery Plugin – Paper Like Unfolding Effect

PFold is a very experimental jQuery plugin that makes it possible to open elements in a paper-like unfolding effect. An element can be unfolded in 3D in order to reveal some other content. The idea is to have several levels of folding, where each step of opening will double the element size, hence imitating a folded paper being opened. A couple of options are available, such as the unfolding direction for each step and the number of folding steps. For browsers that don’t support CSS 3D transforms or transitions, there will be a simple fallback, i.e. the larger content appears.
PFold jQuery Plugin – Paper Like Unfolding Effect
PFold

Wednesday, October 24, 2012

11+ best jQuery lightbox plugin scripts [lightbox alternatives]

jQuery lightbox plugins are being widely used in websites and web applications. They are used for presenting images, videos and html content in an elegant and very focused way. A page with lightbox enabled elements e.g. images a user click will open a modal window where a larger version of the image is presented. The advantages are obvious as users are not required to leave the page to view the content presented by the lightbox and because the area around the featured element is typically faded out focus is increased at what is important. Everyone loves lightbox javascript effects, since the original Lightbox script there has been countless clones generated for all the popular Javascript libraries. Here is a list of some best jQuery lightbox scripts you can find and use them free.
  1. jQuery lightBox plugin
    jQuery lightBox plugin
    jQuery lightBox plugin
    jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery's selector. lightBox is a plugin for jQuery. It was inspired in Lightbox JS by Lokesh Dhakar.
  2. ColorBox
    ColorBox
    ColorBox
    ColorBox is a lightweight customizable lightbox plugin for jQuery. It supports photos, grouping, slideshow, ajax, inline, and iframed content. Its appearance can be controlled through CSS so it can be restyled. Also this plugin can be extended with callbacks & event-hooks without altering the source files. It is completely unobtrusive, options are set in the JS and require no changes to existing HTML.
  3. FancyBox
    fancyBox
    fancyBox
    fancyBox is a tool that offers a nice and elegant way to add zooming functionality for images, html content and multi-media on your webpages in "lightbox" style. It is built at the top of the popular JavaScript framework jQuery and is both easy to implement and a snap to customize. It is a responsive lightbox plugin and can be extended using helpers. This plugin uses CSS3 for shadows and rounded corners.
  4. Facebox
    Facebox
    Facebox
    Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages. It's simple to use and easy on the eyes. Lots of options are availabe in this plugin to customize it as per your requirement.
  5. ChillBox
    ChillBox
    ChillBox
    Inspired by Lokesh Dhakar's Lightbox, ChillBox is a simple, unobtrusive script used to overlay images on top of the current page. ChillBox has been developed using the jQuery Framework. ChillBox does not require the use of images for buttons and is fully rendered using jQuery. ChillBox is fully customisable and you can change the range of options to create a unique version of ChillBox that works with a website theme. ChillBox is fully compatible with web browsers Internet Explorer, Firefox, Opera, Safari and Google Chrome.
  6. Clearbox
    Clearbox
    Clearbox
    Clearbox 3 is a Lightbox-like modal box script to display images, image galleries & various other contents including Flash, Quicktime, Windows Media formats, HTML, inner content, etc. It can show multi-line text information for any content displayed. And, as a unique feature, images displayed can be rotated with a click. Clearbox supports slideshow functionality and every aspect of it can be customized from the settings of the script. It is friendly with Ajax & can display content via Ajax calls. Also, its interface can be presented in any language by supplying a language file.
  7. GreyBox jQuery Lightbox
    GreyBox jQuery Lightbox
    GreyBox jQuery Lightbox
    GreyBox jQuery Lightbox can be used to display websites, images and other content in a beautiful way. You can easily alter the style as it is controlled through CSS. It is very lightweight and it doesnot conflict with popup blockers. Easy to setup and easy to use.
  8. Fresco : A beautiful responsive jQuery lightbox
    Fresco : A beautiful responsive jQuery lightbox
    Fresco
    Fresco is a beautiful responsive lightbox. It can be used to create stunning overlays that work great at any screen size, in all browsers on every device.In fact, Fresco in the first truly responsive lightbox. This handles galleries very vell and has a variety of options. Also it's highly cross browser compatible. 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.
  9. Lightview - The jQuery Lightbox
    Lightview - The jQuery Lightbox
    Lightview - The jQuery Lightbox
    Lightview allows you to easily create the most beautiful overlay windows using the jQuery Javascript library. It supports wide range of medias with gorgeous skins and user friendly APIs. Lightview uses HTML5 to help you deliver the best experience across every browser.
  10. Pirobox Extended - jQuery plugin
    Pirobox
    Pirobox
    Pirobox is an awesome jQuery lightbox plugin that features a slider functionality. It is available free. It has ability to open any kind of files, from inLine content to the swf files, from simple images to pdf files. Another important features are automatic image resizing and drag and drop.
  11. jQuery Superbox
    jQuery Superbox
    jQuery Superbox
    jQuery Superbox! is a script which allows you display windows with the lightbox effect. This plugin is based in jQuery javascript library. It can display pictures, pictures galleries, external pages, a page element or even AJAX loaded content.
  12. prettyPhoto
    prettyPhoto
    prettyPhoto
    prettyPhoto is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax. It's a full blown media lightbox. It is very easy to setup, yet very flexible if you want to customize it a bit. Plus the script is compatible in every major browser, even IE6. It also comes with useful APIs so prettyPhoto can be launched from nearly anywhere (yes, that includes Flash)!

Sunday, October 14, 2012

Foggy – jQuery Plugin for Blurring Page Elements

Foggy is a jQuery plugin for blurring page elements. It supports IE (8 and up), Firefox, Safari and Chrome. Foggy by default uses the "-webkit-filter: blur" CSS attribute. If the browser doesn't support it, Foggy falls back to a manual blur. It makes several copies of the selected HTML element. It adds transparency to all copies and moves each of them by small amount, thus creating the blur effect.
Foggy – jQuery Plugin for Blurring Page Elements
Foggy

Home : http://nbartlomiej.github.com/foggy/
Demo : http://nbartlomiej.github.com/foggy/

Friday, October 12, 2012

A Beginner’s Guide to jQuery

jQuery’s core functionality has a whole host of cool things to explore. jQuery allows you to manipulate HTML elements, transverse around the document, add event listeners (e.g. when you click on an element), perform AJAX requests and effects.
If you don’t know what jQuery is or if some of these terms don’t mean anything to you, don’t worry, we’ll be covering some of these concepts down below.

The Basics

JavaScript is used to add interactivity to the front end of a website. A term often used to describe this type of interactivity on a website is behaviour.
JavaScript works slightly differently in each browser, so people turn to jQuery, a JavaScript framework, to smooth out some of those inconsistencies.
A framework can save us time since the code we’d want to use in many of our projects has already been written in the framework and is often written by a developer or developers with years of experience.
To include jQuery in your project visit jQuery.com and click the big download button. Right click and save it to where your HTML is, most people keep their JavaScript files in a separate folder from their HTML.
It’s best practice to include your JavaScript files at the bottom of your HTML document, just before the closing body tag. If you downloaded jQuery to a folder named js with the name jquery.js and your HTML files were in the same directory as the js folder you’d include it in the following way.
<body>  …  <script src="js/jquery.js"></script>  </body>
You’ll want to create an app.js as this is where we’re going to put our jQuery code.
<body>  …  <script src="js/jquery.js"></script>  <script src="js/app.js"></script>  </body>

The jQuery Function

Now that you’ve included jQuery in your project you need to know how to select HTML elements with jQuery. jQuery is a function that can be passed a series of arguments, the most common is a string containing a CSS selector. You use these selectors in order to select HTML elements to apply behaviour. If you wanted to select all paragraphs on a page you would write the following in a new script tag or in our case app.js:
jQuery("p");
Since p is the CSS selector for selecting all the paragraphs I passed in the string of "p" to the jQuery method. If I wanted to select all elements with the class error I would write the following:
jQuery(".error");
Whilst you can use the jQuery method in full every time you want to select HTML elements, there is a more common short hand way to call the jQuery method, and that’s $. Our two previous examples can be written as $("p") and $(".error"). Throughout the rest of the post we’ll be using the short hand, $.

The Principle of Least Surprise

Now that you know how to select elements it’s time to add behaviour to them. jQuery has a simple interface to apply behaviour. Simply add the method that applies the desired behaviour to the end of the selected elements. If we wanted to hide a paragraph with the class error we call the hide() method.
<p class="error">This is initially hidden.</p> <p>This is not hidden</p>
$("p.error").hide();
It’s that simple. jQuery is designed with the principle of least surprise in mind. You want to show a hidden element? Call show(). Want to vary it’s speed? Pass in a number of milliseconds on how fast you want the animation to take or pass in the string of "fast" or "slow".
So if you want to show the error message slowly after initially hiding it you could do the following.
<p class="error">This is initially hidden, then slowly revealed.</p>  <p>This is not hidden</p>
$("p.error").hide();  $("p.error").show("slow");
And there you have it, you've done you're first jQuery effects.

Chaining it All Together

jQuery lets you keep your code DRY. DRY is an acronym for don't repeat yourself. jQuery allows you to chain methods together so that the above example can be written as:
$("p.error").hide().show("slow");
While lines can get lengthy it's often a way to reduce lines of code and do more.

Going Deeper

You've seen how easy it is to do effects, let's show you how to do some simple DOM transversal. DOM stands for Document Object Model. This is how a browser represents HTML in memory like a tree.
<html> <body> <ul> <li>Apple</li> <li>Amazon</li> <li>Google</li> <li>Microsoft</li> </ul> </body> </html>
The html would be the parent of the body, body would be the parent of the unordered list (ul) and the unordered list would be the parent of all the list items (li). You can access an elements parent in jQuery by using the parent() method. Say we want to hide each list item and before the unordered list we wanted to add a link with the text Show Tech Giants.
First we want to select the list items.
$("li");
Then hide them.
$("li").hide();
Then select the parent DOM element, which will be the unordered list.
$("li").hide().parent();
Be careful when chaining with jQuery transversal methods such as parent(), prev() and next() as they all return a new element rather than the initial element. We can then use the before() method which inserts a given string in to the DOM before the newly selected element, the parent, or the unordered list.
$("li").hide().parent().before("<a href='#'>Show Tech Giants</a>");
So you've done effects to hide, transversal to select a parent element and manipulation to add new HTML on-the-fly. Now we're going to use jQuery's event method click() to listen for click events on the link we've just included.
$("li").hide().parent().before("<a href='#'>Show Tech Giants</a>"); 
$("a").click();
The click method takes one argument which is a function. This is the code you want executing when you click.
 $("li").hide().parent().before("<a href='#'>Show Tech Giants</a>"); $("a").click(function(){ /** Code to be executed **/ });
We're going to show the list items when the link is clicked.
$("li").hide().parent().before("<a href='#'>Show Tech Giants</a>");  $("a").click(function(){   $("li").show();  });
The click listener can be bound to other HTML elements such as a div, span or whatever element you want. You're just not restricted to links.

Conclusion

In conclusion you've seen how easy it is to do effects, DOM transversal, events and manipulation in jQuery. Why not head over to the jQuery Documentation website to see what other cool things you can do in your next project!
Source : teamtreehouse

Windy – jQuery Plugin for Swift Content Navigation

Windy is a jQuery plugin that allows a rapid navigation through a pile of items using some CSS 3D transforms and transitions. The effect of a continuous navigation flow reminds of a deck of cards or sheets flying away, hence the name.
There are several options available, including defining the range of spreading the items when navigating, speed (CSS transitions), adding custom navigations, etc.
Windy – jQuery Plugin for Swift Content Navigation
Windy
For browsers that don’t support CSS 3D transforms or transitions, there will be a simple fallback, i.e. normal navigation of the items (appear/disappear).

Monday, October 8, 2012

Tiny Circleslider - A lightweight circular carousel plugin for jQuery

Tiny Circleslider is a circular slider / carousel. That was built to provide web developers with a cool but subtle alternative to all those standard carousels. Tiny Circleslider can blend in on any wepage. It was built using the javascript jQuery library.
Tiny Circleslider - A lightweight circular carousel plugin for jQuery
Tiny Circleslider


Monday, September 24, 2012

Cloud Zoom – jQuery Image Zoom Plugin

Cloud Zoom is a free jQuery image zoom plugin, a comparable alternative to products such as Magic Zoom. Compared to the popular jQZoom plugin, Cloud Zoom is smaller, has more features and more robust compatability across browsers.
Cloud Zoom – jQuery Image Zoom Plugin

Saturday, September 22, 2012

jQuery 1.8.2 released

jQuery is a new kind of JavaScript Library. Jquery is one of the building blocks of modern web upon which, many web pages, plugins, functionality is based. Its latest 1.8.2 has been released with some new features and several bug fixes.
According to its official blog.
We’re pleased to announce that jQuery 1.8.2 is available! This version fixes several bugs and performance regressions reported from the past couple of releases, and we think the 1.8 line is pretty solid at this point. The only way to know for sure that it works with your code is to test it–so please do!
You can download jQuery from here.

Friday, September 21, 2012

bPopup : jQuery modal popup plugin

bPopup is a lightweight and simple but efficient jQuery modal popup plugin. It doesn't create or style your popup but provides you with all the logic like centering, modal overlay, events and more. It gives you a lot of opportunities to customize so it will fit your needs. Callbacks of several events are available. You can even show content from AJAX in the pop up. Also you can show images, videos and even more iframe option is there.
bPopup : jQuery modal popup plugin
bPopup - jQuery modal popup plugin

Tuesday, September 18, 2012

jQSimpleMenu - Multi Level Hierarchical Drop Down jQuery Menu

jQSimpleMenu is a multi-level hierarchical jQuery drop down menu that helps you add drop down menu in your website without writing a single line of code. You need UL and child items in LI as HTML markup. Just assign class or id to the ul tag and call the function. As simple as that. Design can be customized in the style-sheet file.

jQSimpleMenu - Multi Level Hierarchical Drop Down jQuery Menu
jQSimpleMenu - jQuery Drop Down Menu

Monday, September 17, 2012

Fresco - responsive jQuery lightbox plugin

Fresco is a beautiful responsive lightbox jQuery plugin 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.
Fresco - responsive jQuery lightbox plugin
Fresco

Tuesday, September 11, 2012

jQuery in 2013 - or How to Properly Drop IE

It's a well-known fact that the folks at Microsoft have long had their tail between their legs, because of IE. The proverbial enemy of every front-end developer and the go-to brunt of the joke at conferences and chatrooms (and even in client meetings) has been IE8 and below.
Let's move past the IE bashing, and talk about jQuery's plan to drop support for old IE.
Don't entirely drop old IE until its usage is miniscule.
Certainly, there are plenty of web development firms that have already dropped support. Most of us have long since dropped IE6, with many doing the same for IE7. But there is still a significant push to hold on to the IE8 crowd.
The jQuery team has been plagued by IE for years. JavaScript in old IE (their collective moniker for anything below IE9) is antiquated, slow, and lacks the new features added to the language since their respective launches. As a result, the codebase of jQuery must incorporate solutions to handle issues specific to IE. This makes the library significantly larger, and as a result, it takes a lot longer to load. So, as part of version 2.0, jQuery will be dropping support for old IE.

Sort Of

jQuery is actually dropping the older versions of IE in a very graceful fashion.
Instead of completely dropping old IE in 2.0, they are going to maintain support for 1.9. By doing this, jQuery is doing two main things:
  • Enabling and affirming new, standards-based browser technologies
  • Supporting an old standard (while continuing to label it old)
In other words, they are publicizing to everyone that, yes indeed, there is a user base still on old IE. This is the main argument that comes up when people talk about dropping support for it. Certainly, we don’t want to completely drop support for a significant percentage of users, do we? Of course not! But we are also being transparent by saying that the capabilities (and resulting user experience) of IE are comparatively outdated and should be moved away from as quickly as possible.
Let's give Microsoft some credit, though, in realizing their own mistakes. As Paul Irish recently noted, Windows is pushing updates to IE as “important”, meaning that everyone who is on XP and up will at least have IE8. That’s not the best case, but it's certainly far better than having most of China stuck on IE6. Perhaps this announcement is in part responsible for jQuery's long-awaited and highly-requested decision to remove the IE specific code-bloat.

The Impact on the Pros

So how does this play out for development firms? Here are a few things that this will mean for development firms and freelancers:
  1. Don't entirely drop old IE until its usage is miniscule. Note the word "entirely" here. This suggestion is that, simply, there should be an avenue that the client can take to get support for IE users. IE8 is not IE5 yet.
  2. Don't support IE by default. Make IE support a separate service. The way jQuery is doing it is by saying, "here is a not-as-good alternative." The way you may say it: "IE won't have some of the aesthetic or functional features that other browsers will," or "we can do some optimization specifically for IE, if you absolutely need it, for a certain price."
  3. Understand the standards and why you won't support old IE. This is a big one. When you go into a client meeting, you need to know the reasons why supporting old IE is not a default for you or your company. The reasons to support old IE have nothing to do with the extra effort that is expended by the developer. If you don't want to support old IE because it takes you longer to develop cross-browser code, then you also shouldn't support mobile.
Instead, the right reasons are about the users! Old IE performs badly. It has broken and buggy implementations of almost everything, it is slow, and it doesn't follow standards. Some versions are insecure, and most versions are way behind on implementing new language features that enhance the user experience.
A rule of thumb: the reasons to not support old IE cannot be circumvented by cross-browser compatible code.
Think of old IE as an old car. You wouldn't sell or fix an old broken down car to someone when you know that, for the same price, they could have a brand new one. The old car doesn't follow the regulations of safety or efficiency, and it has a bunch of weird, proprietary parts that aren’t being manufactured anymore. Of course, you could pay extra to have those specific parts shipped to the mechanic from a specialty shop, and the mechanic might be able to fix the car to go a few extra miles. But shouldn't the mechanic do you the favor and get you into the new car as fast as possible?
Before we get a barrage of comments screaming "some users don't have control over what browser they use!", this article is using a broad stroke with a broad brush. Maybe the user doesn't have a choice, but someone does have a choice that could affect the users.

Summary

In 2013, jQuery is making a bold move towards publicly upholding web standards, and dropping default support for out-of-date technology. In 2014, it's likely that jQuery will completely drop support for old IE, although they haven't announced that yet. The way that jQuery is achieving this end-goal is a prime roadmap for developers to follow.
Src : Tutsplus

Monday, September 10, 2012

chillBox - Lightbox Alternative jQuery Plugin

ChillBox is a simple, unobtrusive script used to overlay images on top of the current page inspired by Lightbox. Unlike other lightbox versions, ChillBox does not require the use of images for buttons and is fully rendered using jQuery. ChillBox is fully customisable and you can change the range of options to create a unique version of ChillBox that works with a website theme. ChillBox is fully compatible with web browsers Internet Explorer, Firefox, Opera, Safari and Google Chrome.
chillBox - Lightbox Alternative jQuery Plugin
ChillBox - Lightbox Alternative

Wednesday, September 5, 2012

Avgrund Modal : jQuery plugin for Modal overlay

Avgrund is a jQuery plugin for modal boxes and popups. It uses interesting concept showing depth between popup and page. It works in all modern browsers and gracefully degrade in those that do not support CSS transitions and transformations (e.g. in IE 6-9 has standard behavior). Avgrund is tested with jQuery 1.4+. Avgrund has several options for customizing it easily like width, height, overlayClass, holderClass, showClose, showCloseText, template, etc.
Avgrund Modal : jQuery plugin for Modal overlay
Avgrund Modal jQuery plugin

Sunday, September 2, 2012

Hero Carousel : A jQuery carousel plugin with 100% width & previews of next/previous slide

Hero Carousel is a jQuery carousel plugin with 100% width and previews of next/previous slide. Also it has auto slide functionality. Hero Carousel has language options for the text in 'Next' and 'Previous' button. You can also enable or disable navigation. There is also option for pausing the auto slideshow on hover. 'onLoad', 'onStart' and 'onComplete' methods are available in Hero Carousel.
 Hero Carousel : A jQuery carousel plugin with 100% width & previews of next/previous slide
Hero Carousel

Saturday, September 1, 2012

jQuery 1.8.1 released

jQuery 1.8.1 released
jQuery 1.8.1 has been released. In this recent release the project's developers have addressed more than 30 issues found in version 1.8.0 of the JavaScript library from earlier this month. In jQuery 1.8, the old API for creating custom pseudo selectors was broken by the developers and a new API was introduced, but from jQuery 1.8.1 onwards, the API will be backwards compatible. The update includes a compatibility workaround which will allow older code to work with all versions of the Sizzle JavaScript CSS selector engine; further details about this can be found in the new official Sizzle documentation.
You can download jQuery from here.

Sunday, August 26, 2012

Simple tooltip : jQuery tool tip plugin

Simpletooltip is a jQuery tool tip plugin, thought to insert short tooltips to any element of your website more easily. This plugin has minimal configuration and supports 4 color themes. It's lightweight and fast. 12 positions are available for the placement of tooltip. It doesnot need extra HTML structures and moreover this plugin is cross browser.
Simple tooltip : jQuery tool tip plugin
Simple Tooltip

Saturday, August 25, 2012

Potato UI menu : jQuery drop down navigation menu plugin

jQuery UI Potato Menu is a simple drop down menu plugin for jQuery that allows for both horizontal and vertical variations. It uses nested HTML markup for plugin formation. It comes with minimal styling but its very easy for styling of Potato menu. Certain class is applied to the html element in the plugin using which you can apply your own style and make it look like what you want. You can customize the animation duration and delay before menu disappears when the mouse rolls out of the anchor.
Potato UI menu : jQuery drop down navigation menu plugin
jQuery UI Potato Menu

Friday, August 24, 2012

jQuery now runs on every second website

As websites become more and more interactive, there is a strong need for appropriate tools to achieve that in an efficient way. Webmasters increasingly turn to jQuery to fulfill this need.
jQuery
John Resig wrote a blog post about "Selectors in Javascript" in 2005, describing an idea on how to manipulate HTML elements by using JavaScript. When he finished that post with "more coming very soon", he might not have envisioned how much more there would actually come.
Only seven years after that initial idea, the jQuery library now runs on every second website. An incredible achievement. In the last year, every 4 minutes one of the top 1 million sites started to use jQuery. It was the fastest growing web technology in 2011, and there is no sign of a saturation yet.
When we compare this with other technologies that enable webmasters to build interactive websites, we see for example Flash at 23.1% usage rate and Silverlight at 0.3%. That shows that "Selectors in Javascript" are probably not a bad idea.
There are, of course, other JavaScript libraries that in many ways compete with jQuery. Other libraries offer different concepts and functionality, but the 88.3% market share of jQuery seems to indicate that jQuery delivers what many webmasters need.
Many sites use more than one JavaScript library. One interesting fact is, that sites that use other popular libraries very often use jQuery as well. 49.5% of MooTools sites use jQuery and 49.2% of Prototype sites do. That is almost the same as the overall jQuery usage rate. The fact that a site uses MooTools or Prototype does not reduce the likelihood that is uses jQuery, as if there were no overlapping functionality.
jQuery is used even more amongst the top 10,000 sites, with 58.8% usage rate, a bit less again amongst the top 1,000 sites with "only" 46.2%.
Zimbabwe, Mozambique and Yemen are remarkable in that they are the only countries where jQuery is not the most popular library. jQuery has also a relatively low usage rate in China (33.5%) and Japan (42.9%). The highest usage rates are in Macedonia (71.4%), Ireland (65.1%), Australia (64.7%) and amongst .edu sites (71.5%).
Another interesting finding of our surveys is the fact that jQuery sites are not overly keen on using the jQuery content delivery network. 73.4% of them don't use any CDN, and 94.2% of the rest use the Google Libraries API.
Congratulations to John Resig and the jQuery community. I think it is not too much to say that you have significantly contributed to change the way the web works today.
Src : w3techs

Wednesday, August 22, 2012

TwitterFontana : show tweets in big screen jquery plugin

Twitter Fontana is a jquery plugin to show your tweets on a (big) screen. It is an open-source alternative for those Flash based Twitter Fountains, built using HTML5, CSS (SASS) and Javascript. You can show it in Fullscreen mode also. Either static datasource or live dynamic data source can be used. Styling and other options are also available in Twitter Fontana.
TwitterFontana : show tweets in big screen jquery plugin
Twitter Fontana

 
back to top