45 Fresh Useful JavaScript and jQuery Techniques and Tools

Advertisement

Yes, this is another round-up of fresh and useful Javascript techniques, tools and resources. But don’t close the tab yet, as you might find this one very useful. In this selection we present calendars, forms, buttons, navigation, debugging, optimization and compatibility tables as well as handy resources and tools. We also cover various jQuery-plugins that will help you extend the functionality of your website and improve user experience with ready components or coding solutions.

The last section also covers a number of useful educational resources such as a compilation of useful JavaScript coding practices, a detailed comparison of JavaScript frameworks and general JavaScript programming conventions. We are looking forward to your feedback.

You may be interested in the following related posts:

Calendars and Timelines

jDigiClock – Digital Clock (HTC Hero inspired)4
jDigiClock is a jQuery plugin inspired from HTC Hero Clock Widget.

jDigiClock - Digital Clock (HTC Hero inspired)5

jQuery Sliding Clock v1.16
jQuery transpearant Slider clock with CSS sprites.

jQuery Sliding Clock v1.17

Date / Time Picker8
Note that this control is not designed to work in IE6; although it will function correctly in most cases, the positioning of the calendar may be way off depending on how your page is styled.

Date / Time Picker9

JavaScript Debugging and Validation Tools

Venkman JavaScript Debugger project page10
Venkman is the code name for Mozilla’s JavaScript Debugger. Venkman aims to provide a powerful JavaScript debugging environment for Gecko-based browsers namely Firefox 3.x, the Netscape 7.x series of browsers, Netscape 9.x series, Mozilla Seamonkey 1.x and Mozilla Seamonkey 2.x. It does not include Gecko-based browsers such as K-Meleon 1.x, Galeon 2.x and Netscape 8.x. The debugger is available as an add-on package in XPI format. Venkman JavaScript Debugger has been provided as part of the Mozilla install distribution since October 3rd 2001.

Venkman JavaScript Debugger project page11

CompanionJS12
Companion.JS (pronounced Companion dot JS or CJS) is a Javascript debugger for IE.

 CompanionJS 13

How to Test your JavaScript Code with QUnit14
QUnit is a powerful JavaScript unit testing framework that helps you to debug code. It’s written by members of the jQuery team, and is the official test suite for jQuery. But QUnit is general enough to test any regular JavaScript code, and it’s even able to test server-side JavaScript via some JavaScript engine like Rhino or V8.

How to Test your JavaScript Code with QUnit 15

JS Bin – Collaborative JavaScript Debugging16
JS Bin is an open source collaborative JavaScript debugging tool.

JS Bin - Collaborative JavaScript Debugging17

Forms, Buttons & Navigation

Making a Google Wave History Slider18
Here is shown how to create a Google Wave-like history slider. Using it will enable visitors to go back and forth in time to view the changes that take place on a comment thread.

Making a Google Wave History Slider 19

Fancy Radio Buttons With jQuery20
Creation of 2 mandatory option sets that a user could choose, while hiding off the radio button inputs and using an anchor links to make it a bit more usable.

Fancy Radio Buttons With jQuery 21

Creative Button Animations with Sprites and JQuery22
Fading hover effect for which the transition is smoothed with JavaScript, using jQuery library.

Creative Button Animations with Sprites and JQuery 23

Password (un)Masking24
JavaScript jQuery that toggles the masking and unmasking of the password field.

Password (un)Masking 25

jQuery MagicLine Navigation26
These “sliding” style navigation bars have been around a while, and turns out it’s really pretty darn easy. Here are put two examples together.

jQuery MagicLine Navigation 27

Fixed Fade Out Menu: A CSS and jQuery Tutorial28
The aim is to have a fixed navigation that follows the user when he scrolls, and only subtly showing itself by fading out and becoming almost transparent. When the user hovers over it, the menu then becomes opaque again. Inside of the navigation we will have some links, a search input and a top and bottom button that let the user navigate to the top or the bottom of the page.

Fixed Fade Out Menu: A CSS and jQuery Tutorial 29

jQuery plugin: Simplest Twitter-like dynamic character count for textareas and input fields30
The best way to explain what this plugin does is to mention Twitter. Twitter posts are limited to 140 characters. While typing the Twitter post there is this always present information about how many characters the users have before reaching the limit. The information is not only provided merely by displaying a number, there are different colors applied to certain stages to notify the user about the status.

Sliding Labels v231
Form label keeping the label inline, but sliding it off to the left rather than going away on click.

Writing Efficient JavaScript32

Ketchup Plugin33
Ketchup is a slim jQuery Plugin that validates your forms. It aims to be very flexible and extendable for its appearance and functionality.

Ketchup Plugin34

Layout tools

jQuery {css}designerGrid Plugin35
{css} designerGrid is A jQuery Plugin developed for website interface developers who use the grid system of layout. {css} designerGrid is intended to assist these developers with CSS prototyping.

jQuery {css}designerGrid Plugin36

css-template-layout37
JavaScript (jQuery) implementation of the CSS Template Layout Module

  css-template-layout 38

How to create a fluid grid with jQuery39
Grid-based layout is probably the more preferred way to style up a webpage to give it more magazine-like look and feel. This tutorial is about how to use CSS and Javascript to create a fluid grid-based layout (See demo here). The algorithm/procedure used in this tutorial is very simple and straightforward. There are more advanced algorithms out there which can handle multiple scenarios. But the purpose is to understand the basic logic on how to create such layout. So here it goes…

How to create a fluid grid with jQuery40

closure-templates41
Closure Templates are a client- and server-side templating system that helps you dynamically build reusable HTML and UI elements. They are easy to learn and customizable to fit your application’s needs. Closure Templates support JavaScript and Java and use a data model and expression syntax that works for either language. You can also use the built-in message support to easily localize your applications.

  closure-templates 42

Useful jQuery Plugins

TipTip jQuery Plugin43
TipTip detects the edges of the browser window and will make sure the tooltip stays within the current window size. As a result the tooltip will adjust itself to be displayed above, below, to the left or to the right of the element with TipTip applied to it, depending on what is necessary to stay within the browser window. TipTip is a very lightweight and intelligent custom tooltip jQuery plugin. It uses ZERO images and is completely customizable via CSS. It’s also only 3.5kb minified!

TipTip jQuery Plugin44

jQuery Roundabout45
Roundabout is a jQuery plugin that converts a structure of static HTML elements into a highly customizable turntable-like interactive area. (And now, not just turntables, but many shapes!)

jQuery Roundabout46

jParse – jQuery XML Parse Plugin47
jParse is a jQuery plugin that allows you to parse XML that was fetched with the jQuery .ajax method (making it fully customizable).

jParse - jQuery XML Parse Plugin48

jQuery Quicksand plugin49
Reorder and filter items with a nice shuffling animation.

jQuery Quicksand plugin50

typeQuery, change website typography with jquery51
typeQuery gives the flexibility to change the font-family for everything you define with class, id, or tag, this example is referring to the selected item on a select object with id=”tag” and the font-family value at select object with id=”family”: $($("#tag").val()).css("font-family", $("#family").val());

 typeQuery, change website typography with jquery52

Flip! A jQuery plugin v0.9.953
Flip is a jQuery plugin that will flip easily your elements in four directions.

Flip! A jQuery plugin v0.9.954

Data Encryption With JavaScript: jCryption55
jCryption is a jQuery plugin for encrypting POST/GET data submitted by forms. It uses public-key algorithm of RSA for the encryption & has a PHP file for handling the decryption of data.

Data Encryption With JavaScript: jCryption56

Minimalist jQuery: 11 useful plugins under 4K57
jQuery makes our lives easier. So much so that it’s tempting to use it all the time, inadvertently slowing our page load times (cue YSlow58 and Hammerhead59). Combining, compressing, and delivering scripts at the end of your page helps in the HTTP request department. On the file size front, below are jQuery plugins that give solid bang for your performance buck.

Minimalist jQuery: 11 useful plugins under 4K 60

Undo/Redo in jQuery61
An easy-to-use plugin for adding undo/redo capabilities to a jQuery application. It is based loosely on the Objective-C/Cocoa way of doing things.

 Undo/Redo in jQuery 62

editease63
editEase – jQuery CMS | no fuss, no database, no worries

  editease64

jsHub65
jsHub is a single piece of JavaScript (a “tag”) that can handle reading different sorts of page information and then send them to many different vendors’ products. One piece of code to send to Google Analytics, Omniture SiteCatalyst, WebTrends and Mixpanel. Instead of one piece of JavaScript per vendor, jsHub has a single piece of code (the “hub”) and plugins that know how to translate into the required wire protocol for each vendor. Vendors only maintain the plugin for their product.

What is jsHub?66

Educational JavaScript Resources and Tutorials

Caffeinated Simpleton 67
JavaScript is an amazing little language, but it’s got some quirks that turn a lot of people off. One of those quirks is this, and how it’s not necessarily what you expect it to be. this isn’t that complicated, but there are very few explanations of how it works on the internet. This article is an attempt to explain how this works and how to use it properly.

Caffeinated Simpleton  68

What You Need To Know About JavaScript Scope69
This article discusses how JavaScript handles scope and how various JavaScript libraries provide methods for dealing with it and how they smooth out a few bumps. We’ll also look at how you can get back to basics and do some interesting scope wrangling without a library, a useful approach if you’re writing code that needs to stand alone.

What You Need To Know About JavaScript Scope 70

Learning Advanced JavaScript71
A very nice tutorial to learn JavaScript, containing code and discussion from the upcoming book Secrets of the JavaScript Ninja by John Resig.

Learning Advanced JavaScript72

Highlight search terms automagically with JavaScript and mark73
Script surrounding the search term(s) with the mark element rather than a span, although the class searchword is retained in case you want to style these marks differently from others. In the CSS, the rule article mark is just added to turn it a gentle shade of pink.

10 Really Helpful Traversing Functions in jQuery74
With jQuery, selecting HTML elements is laughably easy. But at times, we may wish to further refine the selection, which can be a hassle when the HTML structure is complicated. In this tutorial, we’ll explore ten ways that we can refine and extend a set of wrapped elements that we wish to operate upon.

10 Really Helpful Traversing Functions in jQuery75

Using keyboard shortcuts in Javascript76
If you want to enhance your web app, Javascript keyboards shortcuts is definitely something to consider. In this article, you’ll learn to use JS keyboard shortcuts, with and without the JQuery framework.

Using keyboard shortcuts in Javascript77

Code Conventions for the JavaScript Programming Language78
This is a set of coding conventions and rules for use in JavaScript programming.

Code Conventions for the JavaScript Programming Language79

jQuery – Select element cheat sheet80
This cheat sheet helps you to find the index of a selected option, set the selected option by value, set the selected option by text, insert a new option before or after another and get the text or value of the selected option.

 jQuery - Select element cheat sheet81

Compare JavaScript frameworks82
Modern Web sites and Web applications tend to rely quite heavily on client-side JavaScript to provide rich interactivity, particularly through the advent of asynchronous HTTP requests that do not require page refreshes to return data or responses from a server-side script or database system. In this article, you will discover how JavaScript frameworks make it easier and faster to create highly interactive and responsive Web sites and Web applications.

Compare JavaScript frameworks83

Park your Horse, Code Cowboy: Professional JavaScript Workflows, Part 184
In this series, we’ll talk about tools & techniques you can use to cover those No’s, and cut a lot of strife & embarrassment from your JavaScript experience.

 Park your Horse, Code Cowboy: Professional JavaScript Workflows, Part 185

JavaScript Reference examples (example source code)86
JavaScript Reference examples, organized by Objects, Properties, Methods & Collections. Some Event Handlers Reference are also available.

 JavaScript Reference examples (example source code) 87

JavaScript best practices88
A compilation of best practices and good advice I’ve amassed over the years, much of it learnt the hard way (experimentation and suchlike). Take the advice below to heart and keep it in a part of your brain that has a quick access route so you can apply it without thinking about it. I am sure you will find things to disagree with, and that is a good thing – you should question what you read, and strive to find better solutions. However, I have found that following these principles has made me a more effective developer and allowed other developers to build upon my work more easily.

JavaScript best practices 89

wtfjs90
JavaScript is a language we love despite it giving us so much to hate. This is a collection of those very special irregularities, inconstancies and just plain painfully unintuitive moments for the language of the web.

wtfjs91

Related Posts

You may be interested in the following related posts:

Poll


Footnotes

  1. 1 http://www.smashingmagazine.com/2009/06/21/50-fresh-javascript-tools-that-will-improve-your-workflow/
  2. 2 http://www.smashingmagazine.com/2010/01/12/45-powerful-css-javascript-techniques/
  3. 3 http://www.smashingmagazine.com/2009/03/08/70-new-useful-ajax-and-javascript-techniques/
  4. 4 http://www.radoslavdimov.com/jquery-plugins/jquery-plugin-digiclock/
  5. 5 http://www.radoslavdimov.com/jquery-plugins/jquery-plugin-digiclock/
  6. 6 http://home.comcast.net/~vonholdt/test/clock_slide/index.htm
  7. 7 http://home.comcast.net/~vonholdt/test/clock_slide/index.htm
  8. 8 http://home.jongsma.org/software/js/datepicker
  9. 9 http://home.jongsma.org/software/js/datepicker
  10. 10 http://www.mozilla.org/projects/venkman/
  11. 11 http://www.mozilla.org/projects/venkman/
  12. 12 http://www.my-debugbar.com/wiki/CompanionJS/HomePage
  13. 13 http://www.my-debugbar.com/wiki/CompanionJS/HomePage
  14. 14 http://net.tutsplus.com/tutorials/javascript-ajax/how-to-test-your-javascript-code-with-qunit/
  15. 15 http://net.tutsplus.com/tutorials/javascript-ajax/how-to-test-your-javascript-code-with-qunit/
  16. 16 http://jsbin.com/
  17. 17 http://jsbin.com/
  18. 18 http://tutorialzine.com/2009/10/google-wave-history-slider-jquery/
  19. 19 http://tutorialzine.com/2009/10/google-wave-history-slider-jquery/
  20. 20 http://theodin.co.uk/blog/design/fancy-radio-buttons-jquery.html
  21. 21 http://theodin.co.uk/blog/design/fancy-radio-buttons-jquery.html
  22. 22 http://www.tutorial9.net/web-tutorials/creative-button-animations-with-sprites-and-jquery-part-2/
  23. 23 http://www.tutorial9.net/web-tutorials/creative-button-animations-with-sprites-and-jquery-part-2/
  24. 24 http://www.vileworks.com/password-unmasking
  25. 25 http://www.vileworks.com/password-unmasking
  26. 26 http://css-tricks.com/jquery-magicline-navigation/
  27. 27 http://css-tricks.com/jquery-magicline-navigation/
  28. 28 http://tympanus.net/codrops/2009/12/11/fixed-fade-out-menu-a-css-and-jquery-tutorial/
  29. 29 http://tympanus.net/codrops/2009/12/11/fixed-fade-out-menu-a-css-and-jquery-tutorial/
  30. 30 http://cssglobe.com/post/7161/jquery-plugin-simplest-twitterlike-dynamic-character-count-for-textareas
  31. 31 http://www.csskarma.com/blog/sliding-labels-v2/
  32. 32 http://www.csskarma.com/blog/sliding-labels-v2/
  33. 33 http://demos.usejquery.com/ketchup-plugin/index.html
  34. 34 http://demos.usejquery.com/ketchup-plugin/index.html
  35. 35 http://www.kromosome.net/cssdesignergrid/
  36. 36 http://www.kromosome.net/cssdesignergrid/
  37. 37 http://code.google.com/p/css-template-layout/
  38. 38 http://code.google.com/p/css-template-layout/
  39. 39 http://blog.creativityden.com/fluid-grid-using-jquery/
  40. 40 http://blog.creativityden.com/fluid-grid-using-jquery/
  41. 41 http://code.google.com/p/closure-templates/
  42. 42 http://code.google.com/p/closure-templates/
  43. 43 http://code.drewwilson.com/entry/tiptip-jquery-plugin
  44. 44 http://code.drewwilson.com/entry/tiptip-jquery-plugin
  45. 45 http://fredhq.com/projects/roundabout/
  46. 46 http://fredhq.com/projects/roundabout/
  47. 47 http://jparse.kylerush.net/
  48. 48 http://jparse.kylerush.net/
  49. 49 http://razorjack.net/quicksand/
  50. 50 http://razorjack.net/quicksand/
  51. 51 http://thinkinginweb.com/sections/articles/18-11-2009-typeQuery-change-website-typography-with-jquery.aspx
  52. 52 http://thinkinginweb.com/sections/articles/18-11-2009-typeQuery-change-website-typography-with-jquery.aspx
  53. 53 http://lab.smashup.it/flip/
  54. 54 http://lab.smashup.it/flip/
  55. 55 http://www.webresourcesdepot.com/data-encryption-with-javascript-jcryption/
  56. 56 http://www.webresourcesdepot.com/data-encryption-with-javascript-jcryption/
  57. 57 http://trif3cta.com/blog/entry/jquery-plugins-under-4k/
  58. 58 http://developer.yahoo.com/yslow/
  59. 59 http://stevesouders.com/hammerhead/
  60. 60 http://trif3cta.com/blog/entry/jquery-plugins-under-4k/
  61. 61 http://jscott.me/jquery.undoable.html
  62. 62 http://jscott.me/jquery.undoable.html
  63. 63 http://code.google.com/p/editease/
  64. 64 http://code.google.com/p/editease/
  65. 65 http://www.jgc.org/blog/2009/10/what-is-jshub.html
  66. 66 http://www.jgc.org/blog/2009/10/what-is-jshub.html
  67. 67 http://justin.harmonize.fm/index.php/2009/09/an-introduction-to-javascripts-this/
  68. 68 http://justin.harmonize.fm/index.php/2009/09/an-introduction-to-javascripts-this/
  69. 69 http://www.smashingmagazine.com/2009/08/01/what-you-need-to-know-about-javascript-scope/
  70. 70 http://www.smashingmagazine.com/2009/08/01/what-you-need-to-know-about-javascript-scope/
  71. 71 http://ejohn.org/apps/learn/
  72. 72 http://ejohn.org/apps/learn/
  73. 73 http://www.brucelawson.co.uk/2010/highlight-search-terms-automagically-with-javascript-and-mark/
  74. 74 http://net.tutsplus.com/tutorials/javascript-ajax/10-super-helpful-traversing-functions-in-jquery/
  75. 75 http://net.tutsplus.com/tutorials/javascript-ajax/10-super-helpful-traversing-functions-in-jquery/
  76. 76 http://www.catswhocode.com/blog/using-keyboard-shortcuts-in-javascript
  77. 77 http://www.catswhocode.com/blog/using-keyboard-shortcuts-in-javascript
  78. 78 http://javascript.crockford.com/code.html
  79. 79 http://javascript.crockford.com/code.html
  80. 80 http://www.myphpetc.com/2009/03/jquery-select-element-cheat-sheet.html
  81. 81 http://www.myphpetc.com/2009/03/jquery-select-element-cheat-sheet.html
  82. 82 http://www.ibm.com/developerworks/web/library/wa-jsframeworks/index.html
  83. 83 http://www.ibm.com/developerworks/web/library/wa-jsframeworks/index.html
  84. 84 http://dailyjs.com/2010/01/27/pro-practices-1/
  85. 85 http://dailyjs.com/2010/01/27/pro-practices-1/
  86. 86 http://www.java2s.com/Code/JavaScriptReference/CatalogJavaScriptReference.htm
  87. 87 http://www.java2s.com/Code/JavaScriptReference/CatalogJavaScriptReference.htm
  88. 88 http://dev.opera.com/articles/view/javascript-best-practices/
  89. 89 http://dev.opera.com/articles/view/javascript-best-practices/
  90. 90 http://wtfjs.com/
  91. 91 http://wtfjs.com/
  92. 92 http://www.smashingmagazine.com/2009/06/21/50-fresh-javascript-tools-that-will-improve-your-workflow/
  93. 93 http://www.smashingmagazine.com/2010/01/12/45-powerful-css-javascript-techniques/
  94. 94 http://www.smashingmagazine.com/2009/03/08/70-new-useful-ajax-and-javascript-techniques/
  95. 95 http://answers.polldaddy.com/poll/2842024/
  96. 96 http://www.polldaddy.com

↑ Back to topShare on Twitter

The Smashing team loves high-quality content and cares about the little details. Through our online articles, Smashing Books, eBooks as well as Smashing Conferences, we are committed to stimulating creativity and strengthening the web design community’s creative forces.

Advertising
  1. 1

    Finally! I was really waiting on one these nice summaries of good jQuery techniques… Thanks!

    edit: The one’s with pretty radio buttons, magicline and flip! are awesome..

    0
  2. 2

    Yes, this is a good post. Always great to see what/how jQuery is changing web interactivity. Thanks SM

    0
  3. 3

    amazing post, very useful! i liked the labels’ one! keep going!

    0
  4. 4

    Great article, SM!

    0
  5. 5

    Rodrigo Acevedo

    March 12, 2010 8:22 am

    Wow! i can`t close my mouth! ..
    This was an amazing post about Jquery …
    Thanks :D

    -1
  6. 6

    Nice article, great collection, looks like an army of jquery plugins…

    0
  7. 7

    indeed dude ! After long time we had a jquery round up. I love quicksand most. Moreover i find really unkown jquery plugins http://www.webdeveloperjuice.com/2010/03/12/9-jquery-plugins-you-probably-havent-seen/
    My favr8 quicksand is also listed here :)

    2
  8. 8

    Gláuber Kélvin

    March 12, 2010 9:51 am

    Gostei da lista. Vai me ajudar e muito!! ;D BRASIL

    0
  9. 9

    Useful list. jQuery is very powerful in its simplicity.

    0
  10. 10

    Shoulda mentioned the jQuery before/after from catchmyfame.com

    2
  11. 11

    jQuery is certainly not simple… It’s 50kb and most of the functions call other “factory” functions.

    -1
  12. 12

    Yeah, this is WEB 2.0! Thanks you very much for such great articles.
    Greetings from Germany!

    1
  13. 13

    Celalettin Akın

    March 12, 2010 12:06 pm

    Yes, yes. These are really very useful.

    0
  14. 14

    This is amazing, thank you so much for putting this together.

    0
  15. 15

    Fantastic list, bookmarked!

    0
  16. 16

    Great post. I’m currently learning JS, and its the HARDEST thing ever. lmao.

    I have used jQuery several times, but this coding from scratch thing is the pits. :D

    1
  17. 17

    Thanks for Sharing.
    It was great collection. So many new things for me in jquery.

    0
  18. 18

    I just start learning Javascript, it’s very complicated for me, this collection is really useful. Thanks for sharing.

    0
  19. 19

    nice collection, good to read

    0
  20. 20

    Hey

    Thanks for sharing such great content.

    0
  21. 21

    Thanks :)

    0
  22. 22

    It is for the sake of this kind of posts I keep reading Smashing Magazine. Great!

    0
  23. 23

    Does anyone know any jQuery plugin similar like Gmail, when you change any input in form and want to go on any other page, script warns you that didn’t save changes (unless you click on submit button)?

    0
  24. 24

    Too much jquery here. Mootools too, needs attention.

    1
  25. 25

    Thanks for that.

    -1
  26. 26

    So great the article is! It’s very helpful for me~~

    -1
  27. 27

    Thanks for this in depth article! Really useful!

    -1
  28. 28

    Nice post!

    Gives me some great ideas as a designer knowing that certain techniques can be now incorporated into the build.

    0
  29. 29

    Yeah, I had seen Quicksand in another blog a while ago…also an amazing plugin.
    Thanks for the link. Some good plugins in there as well.

    0
  30. 30

    Few in the beginning are fascinating. Thanks for sharing.

    0
  31. 31

    designebookcover

    March 13, 2010 11:39 am

    thanks for this great tips

    0
  32. 32

    Colorado Wedding Photographer, JasonG

    March 13, 2010 11:58 am

    Thank you for these…using a lot of jquery lately in my site design.

    0
  33. 33

    Amazing Post!

    Thanks so much!

    0
  34. 34

    its awesome…wow

    0
  35. 35
  36. 36

    Ketchup Plugin does not work good at all. It has js-errors in the librabry itself. I tried to leave a word on their page, but they just delete it.

    0
  37. 37

    Sorry, this just looks like you put all the random jquery bookmarks you had into one post.

    0
  38. 38

    Thank you SM for amazing article

    0
  39. 39

    Thanks for the post ilike all about jQuery ,, but anyone now how to create image slideshow gallery like http://lodjixmedia.net/ iam confused to mix fade in effect with autoplay my site always not show the fade in effect !! anyone can help me please

    1
  40. 40

    I’m loving cssDesignerGrid, certainly helps with page layout when designing!

    0
  41. 41

    I particularly like the way you’ve used an image of PHP code for an illustration for the “What you need to know about Javascript scope” educational material…

    Thanks guys :)

    0
  42. 42

    Great post!

    0
  43. 43

    Cre8ive Commando

    March 14, 2010 4:12 pm

    Nice post. Would have liked to have seen some image slideshows in there too. =)

    -1
  44. 44

    Nice post, these are very useful plugins. It is also some very cool ones that i havent seen before on http://www.vectornpixel.com , check it out. They have some cool image sliders

    0
  45. 45

    wow! This is really useful .Thanks

    0
  46. 46

    this is article is more than amazing

    its helpful and comperhansive

    thanks alot

    0
  47. 47

    Your writing way to little about asp.net its like it dont even exists to you guys ^^. Even if you like it or not theres alot of big clients requesting it. Personally i realy like the open source CMS Umbraco built on it. Its simple and yet very flexible.

    0
  48. 48

    nice I love it

    0
  49. 49

    Very nice—but I’m a MooTools guy. It’s easy enough to translate these techniques to MooTools—it’s more the interactive solutions that are of interest here. I guess the MooTools vs JQuery debate is another one of those Mac vs PC, Joomla vs Drupal, Coke vs Pepsi things that probably benefits everyone in the end.

    0
  50. 50

    Lucifix: I use dirtyform.js

    0
  51. 51

    hmmmm,

    Smashing is wasting it’s time. All these stuff are just one click away from browser’s google search box. I think smashing should produce really really smashing contents otherwise it will no more be smashing.

    Thanks

    0
  52. 52

    stunning samples… thanks…

    0
  53. 53

    Sweet! Another list of jQuery plugins on Smashing Magazine, how refreshing! /s

    Does anyone bother to learn how to do anything on their own anymore, or is it just easier to grab yet another poorly written plugin and pretend you understand whats going on.

    0
  54. 54

    @Jamie fake it ’til you make it :)

    Awesome list, going to read everything in here.

    0
  55. 55

    nice jquery tools some of them I saw used at jquery templates flashmint.com/show-type-jquery.html

    0
  56. 56

    Great Thanks

    0
  57. 57

    What a great article!!!! thanks a ton for sharing….

    0
  58. 58

    hey pals,

    this is one of the best article i have gone through… thanks for sharing.

    0
  59. 59

    Cool article, as usualy!.. tx

    0
  60. 60

    A lot of content here to try out on some of my own projects, thanks alot.

    0
  61. 61

    Awsome…. quite fresh and new techniques…!!!

    0
  62. 62

    And again… under, what you need to know about javascript scope, the wrong picture is used. Please, please learn the difference between PHP and JavaScript.

    Nice article by the way!

    0
  63. 63

    Great Resource …..

    0
  64. 64

    why nothing about Extjs ??
    No tutorial?!

    0
  65. 65

    Munnabhai- Dhanashree Inc

    April 5, 2010 3:09 am

    Nice jquery tools some of them I used, This is really useful .Thanks

    From :
    Munnabhai – Dhanashree Inc

    0
  66. 66

    Great roundup of more javascript tools… keep em coming!

    0
  67. 67

    this is amaizing blog

    0
  68. 68

    An PHP image upload tutorial with the “mime-type”, also a simple search function is a good way to create a new tutorial.

    -1
  69. 69

    Great post. Very useful. Thanks for sharing.

    PS: It seems that the Date/Time Picker uses the prototype framework instead of jquery.

    0
  70. 70

    Nice collection of tools;)

    0
  71. 71

    Cool List!!

    I created myself a jquery plugin. It would be cool.

    please see here:-
    http://jquery13.blogspot.com/2010/08/with-jquery-becoming-ever-more-popular.html

    Best Regards
    Aman

    0
  72. 72

    Too good list.
    Thank you so much.

    0
  73. 73

    For those of us who choose not to use jQuery or any other black-box code, but do sometimes use (or customize) individual utility functions floating around online… the kind that are stand-alone and don’t require any library, I mean… how about some articles about useful stand-alone utility functions and how to use them?

    For example, stand-alone domReady-type functions, “dollar sign” (get element) functions, Tinybox2 for JS modal windows, functions for color animation, for tabbed navigation, for retrieving & setting CSS styles, etc… would appreciate some coverage of those, for folks who like to mostly (but not entirely) roll their own code. Thanks.

    0
  74. 74

    ALAJAX is missing here:
    http://www.alajax.com
    a jQuery plugin to ajaxify forms.

    0

↑ Back to top