100 Best JavaScript Resources

by Matt on February 9, 2009 · 88 comments

in Coding Resources,Design Tools,Featured,Resources

JavaScript is an extremely useful scripting language for enhancing user experience and usability. It is becoming more and more popular, as more developers begin to make cool techniques accessible. Here are 100 excellent JavaScript (and a few AJAX) techniques, plugins, and resources based on the major libraries of jQuery, Prototype, Scriptaculous, MooTools, and Dojo.

JavaScript Techniques and Tutorials

Coda Pop-Up Tutorial

coda_js

Build An Incredible Login Form with jQuery

slider_js

Create a Slick Tabbed Content Area using CSS & jQuery

tablist_js

Create a Simple, Intelligent Accordion Effect Using Prototype and Scriptaculus

accordian_js

Create a Simple, Powerful Product Highlighter with MooTools

highlighthover_js

Creating a Dynamic Poll with jQuery and PHP

poll_js

Creating a “Filterable” Portfolio with jQuery

filterfolio

Leopard Desktop with jQuery using jqDock

leopard1_js

Adding to Our Leopard Desktop with jQuery

leopard2_js

Use the jQuery UI to Control the Size of Your Text

textslider_js

Animated Drop Down Menu with jQuery

dropdown_js

Animated Menus Using jQuery

hovermenu_js

Fancy Box

lightbox_js

Creating a Slick Auto-Playing Featured Content Slider

contentslider_js

Easiest Tooltip and Image Preview Using jQuery

hovertooltip_js

jQuery Pagination

pagination_js

Using CSS and Mootools to simulate Flash horizontal navigation effect

horizontalslider_js

How to Mimic the iGoogle Interface

igoogle_js

Submit A Form Without Page Refresh using jQuery

contact_js

Coda Slider Effect

codaslider_js

A Mac OS X-style Dock In JavaScript

dock_js

Starbox

starboxes_js

Magic Zoom

magiczoom_js

Magic Magnify

magnify_js

Apple Slider Gallery

appleslider_js

Building an Animated Cartoon Robot with jQuery

cartoonrobot_js

Animate a hover with jQuery

animatehover_js1

Learning jQuery: Fading Menu – Replacing Content

menufader_js

Using jQuery for Background Image Animations

menubgeffects_js

Opacity Change

opacity_js

jQuery image upload and crop

crop_js

Password Strength Meter

password_js

jQuery Autotab

autotab_js

Sliding Top Panel

panelslide_js

context highlighting web forms

formhiglighting_js

jQuery hover sub tag cloud

cloudhover

jQuery pageSlide

pageslider_js

Create a simple ul list with a nice slide-out effect for
  • elements
  • ullist_js

    Portfolio Layout Idea Using jQuery

    foliolayout_js

    Easy Image or Content Slider

    featslider_js

    mooSlide

    mooslides_js

    jQuery.SerialScroll

    scrollto_js

    Agile Carousel

    agilecarousel_jhs

    Animated JavaScript Slideshow

    slideshow_js

    Hyphenation in Web

    hyphenation_js

    Textboxlist Auto-Completion

    textboxlist_js

    CSS Sprites2

    csssprites2_js

    jParralax

    jparallax_js

    BarackSlideshow

    obamaslideshow_js

    Galleria

    galleria_js

    ajax im

    ajaxim_js

    Ajax AutoSuggest

    ajaxautosuggest_js

    Taggify

    phototooltip

    MooFlow

    mooflow_js

    amCharts

    amcharts

    PlotKit

    plotkit_js

    JavaScript tabifier

    tabifier_js

    fValidator

    fvalidator_js

    jQuery Interactive Date Range Picker

    daterange_js

    NoGray Time Picker

    timepicker_js

    Yetii – Yet (E)Another JavaScript Tab Interface

    yetii_js

    Creating a carousel with MooTools

    mootoolscarousel_js

    Carousel.us

    carouselus

    How to Load In and Animate Content with jQuery

    ajaxload_js

    iPhone Unlock Screen

    ipone_js

    Create an apple style menu and improve it via jQuery

    applestylemenu_js

    AJAX Upload

    ajaxupload_js

    Create Accessible Charts Using Canvas and jQuery

    canvaschart_js

    Simple jQuery Form Validation

    validator_js

    jQuery Context Menu

    contextmenu_js

    Kwicks for jQuery

    kwicks_js

    jQuery File Tree

    filetree_js

    jQuery iPod-style Drilldown Menu

    ipodmenu_js

    MooTools Home Page-Inspired Navigation Effect

    naveffect_js1

    jQuery books widget

    booksslider_js

    Revealing Photo Slider

    photoslider_js

    Facebox Image and Content Viewer

    facebookcontent_js

    Simple Controls Gallery

    gallerycontrol

    Fix Overflow

    overflowfix_js

    Setting Equal Heights with jQuery

    equalheights_js

    Scrollable

    scrollable_js

    Jcrop

    jcrop_js

    Music Player Using Mouse Gestures and Hotkeys

    mediaplayer_js1

    Moo Canvas

    canvas_js

    iCarousel

    horiscroller2_js

    Rich Text Editor

    texteditor_js

    Creating a table with dynamically highlighted columns

    table_js

    Simple selector list using CSS and Javascript

    selectorlist_js

    Change the layer background color using a simple Javascript functions

    bgcolorchanger_js

    Simple images slider to create Flickr-like slideshows

    flickrbrowser_js

    Lightbox using mootools and pathfusion multibox

    lightboxmootools_js

    Fantastic News Ticker Newsvine-like using Mootools

    newsticker_js

    JavaScript Articles

    10 Smart Javascript Techniques to Improve Your UI

    10js

    jQuery Tutorials for Designers

    jswdw

    What You Need to Know About jQuery 1.3

    jquery13

    JavaScript Websites

    Sikbox

    sikbox

    Javaspript & AJAX on NETTUTS

    nettutsjs

    Woork

    woork

    JQuery.com

    jquery

    MooTools

    mootools

    Share Your Favorites!

    Please, share your favorite techiques or leave a nice comment.

    Spread the Love:

    { 82 comments… read them below or add one }

    AdrianMG February 9, 2009 at 6:23 pm

    Thanks for the referral ;)

    Jonny February 9, 2009 at 7:12 pm

    This is awesome, thanks! :)

    joyoge designers' bookmark February 9, 2009 at 7:43 pm

    very nice useful tutorials thanks..

    Justin Slack February 10, 2009 at 2:54 am

    Fantastic resource. Thanks for all your effort.

    Edwin February 10, 2009 at 6:33 am

    Great list! Thnx! :)

    Craig - Abrishca Digital Media February 10, 2009 at 7:38 am

    What a stacked roundup! Thanks heaps.

    Eduardo Sasso February 10, 2009 at 11:39 am

    Great post! Thanks for featuring Sikbox.

    Funny Moments February 10, 2009 at 11:46 am

    Cool list.

    cssProdigy February 10, 2009 at 10:18 pm

    Great list.

    Angie Bowen February 11, 2009 at 12:45 am

    Wow, great roundup! So much to go through!

    Saravana Kumaran.T February 11, 2009 at 9:41 am

    I had collected more information’s for your sites thanks for your help.

    Saravana Kumaran.T February 11, 2009 at 9:44 am

    i had get the source code of this
    “Build An Incredible Login Form with jQuery”
    but its not working in my browsers (IE and firefoxe)

    Zed February 11, 2009 at 7:13 pm

    Incredible post. Thank you very much…

    Dan February 12, 2009 at 5:32 am

    Seen many of these before, but some great new links too.

    Fantastic list!

    Antonio Lupetti February 12, 2009 at 5:12 pm

    Thanks for the mention :)

    clicker February 13, 2009 at 4:56 am

    Great collection, I only miss some more carousel effects…

    Peter Aland February 13, 2009 at 5:02 am

    great resource, we will be using some of these!

    chaoskaizer February 13, 2009 at 9:14 am

    awesome resources, thanks for sharing. Seem like there is 103 resources link & most are jquery ^D

    console.log(‘%n’,$(“div.post h2 a[onclick]“));

    Joseph McCann February 13, 2009 at 10:01 am

    I just posted this one the yesterday, February 12th:

    A Gracefully Degrading Tabs Plugin & Tutorial

    AudiOxide February 15, 2009 at 4:04 am

    What an impressive list! Excellent Roundup!

    Kevin February 15, 2009 at 2:32 pm

    This is truly incredible for a rookie like myself. Thanks for all the resources.

    Antonio February 16, 2009 at 2:48 pm

    5 * List

    DUGG!!!

    February 16, 2009 at 2:55 pm

    Cool !
    Thanks …

    webtizer February 16, 2009 at 4:46 pm

    thanks for great resource .. really useful

    Loktar February 19, 2009 at 3:38 pm

    The AMCharts is Flash not JS… Great list other than that though!

    Selvam February 19, 2009 at 8:35 pm

    This is awesome, fantastic resource. Thanks for all your effort.

    Paul February 20, 2009 at 1:36 am

    That’s quite the list. I’m definitely going to bookmark this. Thank you!

    p@r@noid February 20, 2009 at 4:13 am

    That’s a huge list

    thenetguruz February 20, 2009 at 11:46 am

    Awesome list! A little too big to check all but I have saved this page for future reference. Thanks a lot.

    UTogger February 21, 2009 at 12:25 am

    Wow–such an extensive list! Thanks for this great map to great resources!

    Marco February 22, 2009 at 6:03 am

    Woooow – That’s one amazing and complete list! Bookmarked this page, want to try some of the tutorials later ;).

    Also, thanks for including my “iPhone Unlock Screen” tutorial!

    Keep up the good work.

    Greetings,,,

    matt February 22, 2009 at 5:34 pm

    great list – thanks for this – i’ve been looking for some of these.

    karthik February 23, 2009 at 12:59 am

    THANKS FOR THIS REFERRAL…. IT IS AWESOME

    inventinoary February 24, 2009 at 8:58 am

    Great scripts ! thanks for your post.

    Bob February 26, 2009 at 12:01 am

    Where is Quirksmode.org ?

    PS Website Design February 27, 2009 at 2:26 pm

    Great list. Nice to see some new web sites and not the same old, same old.

    Darpan March 7, 2009 at 4:00 am

    very nice, fantastic script, you are a genius

    loveleen March 13, 2009 at 4:36 am

    thats an amazing list.. !!
    bookmarked!!

    Jeremy March 14, 2009 at 2:02 pm

    Very nice list of scripts! I will def bookmark this :)

    Snurf March 17, 2009 at 5:54 am

    Great Stuff, all the info on this page has been a great help thanks a lot.

    sir jorge March 19, 2009 at 6:45 pm

    I needed this months ago! I’m glad it’s here though.

    Meshach March 19, 2009 at 10:12 pm

    Very exhaustive list. Wow!

    Jeremy McLean April 2, 2009 at 2:10 pm

    I Love these resources – they are extremely useful!

    Thank you,
    Twitter – @jeremymclean

    Mason Stewart April 4, 2009 at 2:06 pm

    Fantastic and overwhelming! Thanks a batrillion!

    Mahbub April 20, 2009 at 4:51 am

    WOW, what an effort to put them al together. Jquery rocks in most of them.!!

    Bill April 22, 2009 at 8:05 am

    It just amazes me what some people can create.

    Jinesh April 28, 2009 at 9:19 am

    thanx for sharing….

    Jurgen May 14, 2009 at 7:16 am

    Great collection! Thanks for sharing!

    neki chan June 6, 2009 at 7:07 pm

    oww.. nice >.<
    thanks ….

    Yunus June 17, 2009 at 11:10 am

    Great collection.

    Leave a Comment

    { 6 trackbacks }

    Previous post:

    Next post: