25 Fresh and New jQuery Plugins and Tutorials

With jQuery becoming ever more popular, the volume and quality of plugins and tutorials that developers are releasing and writing are increasing rapidly. If you are looking for the latest in jQuery this is the post for you, all the plugins and tutorials in this post are new and fresh, they have only recently been published (within the last six weeks).

Fresh jQuery Plugins

vTip

Download Plugin »
View Demo »
vTip is designed to quickly provide lightweight (706b js, 272b CSS, 270b image) tooltips, using jQuery any element with a class of "vtip" will have it’s title attribute turned into a sleek, customizable tooltip without the klunk and loading time of a large tooltip script.

QuickFlip 2

Download Plugin »
View Demo »
QuickFlip 2 is a major reworking of the original Quick Flip plugin, it is a plugin that flips any piece of HTML markup over like a card. The new version is faster and easier to use – simply call the flip animation through a jQuery selector and the QuickFlip will flip the front panel to show its back.

Juitter

Download Plugin »
View Demo »
Juitter is a lightweight, fast & customizable jQuery Plugin that allows you to place a live feed of Twitter on your website. You can use Juitter to display tweets from a specific user or specific words, you can restrict results by language, and it even supports multiple users and keywords.

jPlayer

Download Plugin »
View Demo »
jPlayer is a jQuery plugin that plays and control audio files in your webpage, you can also create and style an audio player using just HTML and CSS and it streams faster using HTML5 and alternative ogg format support.

MopBox

Download Plugin »
View Demo »
MopBox is draggable lightbox that supports divs (HTML and CSS), images , flash, video, etc. A slider is shown automatically if it has more than one child, a slider navigation is shown and it will automatically resize.

MopSlider

Download Plugin »
View Demo »
The very cool looking MopSlider plugin is feature content slider that supports images, flash, html…almost anything.

jLayout

Download Plugin »
View Demo »
The jLayout jQuery plugin provides three layout algorithms for laying out HTML elements in web pages. The first is border, which lays out components in five different regions. The second algorithm is grid, which lays out components in a user defined grid. The third algorithm is flexGrid, which lays out components in a grid with flexible column and row sizes. The plugin allows you to lay out your elements with as little code as possible, and behaves correctly when used with margins, padding and borders.

PassRoids

Download Plugin »
View Demo »
The PassRoids (love the name) jQuery plugin was designed to allow simple integration of password strength measurement and verification and display it in a simple method to the end user. Installation requires minimal js and css code and can be setup in a matter of minutes.

AD Gallery

Download Plugin »
View Demo »
AD gallery is similiar in functionality to Thickbox and Lightbox, but much better. It is a smooth and feature rich image gallery plugin, its two main features are the various transition effects and the auto scaling of images.

ColorBox

Download Plugin »
View Demo »
ColorBox is a light-weight (9kb), easily customizable lightbox plugin for jQuery 1.3. It supports photos, photo groups, slideshow, ajax, inline, and iframed content.

jSlickmenu

Download Plugin »
View Demo »
Its these amazing effects like these that will end up making Flash obsolete, all developed with jQuery and HTML5. The only downside to this plugin is that it can only only work on Safari, Google Chrome and Firefox 3.5 (only), as they are the only browsers supporting the Transform and Box-Shadow property of CSS3 via the -webkit- prefix. I suppose this plugin is glimpse into the near future of web development.

Interactive, Filterable Portfolio

Download Plugin »
View Demo »

Visualize

Download Plugin »
View Demo »
Accessible data visualization in HTML has always been tricky to achieve, particularly because elements such as images allow only the most basic features for providing textual information to non-visual users. With the development of the Visualize plugin you can now have a simple method for generating bar, line, area, and pie charts from an HTML table, and allows you to configure them in a variety of ways.

Fresh jQuery Tutorials

Creating a Keyboard with CSS and jQuery

View Tutorial »
View Demo »
In this tutorial you will create an amazing online keyboard with CSS, and then make it work with jQuery. The keyboard includes "action" keys (caps lock, shift, and delete) which dynamically changes the keyboard when clicked.

Create Featured Content Slider

View Tutorial »
View Demo »
Here you will learn how to create an intuitive auto-playing content slider.

Auto Load and Refresh Div every 10 Seconds

View Tutorial »
With five simple lines of code, in this small tutorial, you will learn how to auto load and refresh a div every 10 seconds. This is similiar to the way that Facebook shows the most recent posts. This would be useful if you show your Twitter timeline on your blog.

Making a Content Slider

View Tutorial »
View Demo »
In this tutorial you’re going to be using the jQuery UI slider widget to create an attractive and functional content slider.

Better Password Inputs, iPhone Style

View Tutorial »
View Demo »

Create a stream of messages Monitter-like with PHP and jQuery

View Tutorial »
View Deno »
This tutorial illustrates a very simple way to work with the Twitter API in order to implement a search in the Twitter public timeline and display search results with an animated stream of messages (tweets) similar to Monitter.

Create fancy share box with CSS and jQuery

View Tutorial »
View Demo »
This tutorial will show you how to turn an unordered list (UL) into an fancy social bookmarking widget. You will learn how to style the box, how to add interactivity, and how to create a jQuery plugin that will turn any UL into a social bookmarking sharing box.

jQuery Infinite Carousel

View Tutorial »
View Demo »
This tutorial will walk through the fundamentals of the effect and how to recreate the scrolling carousel that works in the same way as the carousel that is on the Apple Mac ads page.

Create a Content Rich Tooltip with JSON and jQuery

View Tutorial »
View Demo »
This tutorial will show you how to build a cool and smooth tooltip that is powered by jQuery, with information pulled from a JSON array.

Making an Expanding Code Box

View Tutorial »
View Demo »
On blogs that like to share snippets of code, it is common to use the <pre> tag to wrap the code so that the spacing/indenting is maintained and long lines do not wrap. While this is desirable behavior, it can be undesirable to have those un-wrapped lines break out of their containers awkwardly and overlap other content. This tutorial will show you how to create the solution.

Create a Slick and Accessible Slideshow

View Tutorial »
View Demo »
In this in-depth tutorial, you’ll learn how to create a usable and web accessible slideshow widget for your site using HTML, CSS, and JavaScript (jQuery).

Create a simple file or image management system with jQuery

View Tutorial »
View Demo »

RSS & Twitter

Grab the RSS Feed: Speckyboy RSS ».
Speckyboy on Twitter : Speckyboy on Twitter ».

You might also like…

50 Useful Tools and Generators for Easy CSS Developmentc »
20+ Resources and Tutorials for Creative Forms using CSS » »
24 CSS (in some cases with jQuery) Navigation and Menu Tutorials » »
22 CSS Button Styling Tutorials and Techniques » »
15 Amazing jQuery Image Gallery/Slideshow Plugins and Tutorials » »
51 Amazing and Inspiring Blog Style Web Designs » »
6 Alternative Sources of Design Inspiration, Where do you get yours? » »
8 Amazing Free Online Creative Portfolio Community Sites – Share and Inspire » »
20 Inspirational Resources for Logos and Logotypes – Get Creative! » »