JSFiddle

  • jQuery UI Autocomplete with local data

    Here we have a local data object instead of a server URL, By overriding some internal methods, we can control the output.

    //var results = [];
    
    // For simpliblonde's sake, hair can be brown, blonde or gray.
    var fakeData = [
    {name:'Albert', age:25, hair ...
  • Typeahead Bloodhound Filter

    Filter a Bloodhound dataset dynamically

    var fakeData = [
    {name:'Albert', age:25, hair:'blonde'},
    {name:'Allen', age:26, hair:'brown'},
    {name:'Brent', age:42, hair:'brown ...
  • jQuery on() with Multiple Events

    Just a syntax example for reference.

    // Multiple events.
    $("#myWrapper").on({
        mouseenter: function() {
            event.preventDefault();
            // Handle mouseenter...
            console.log(event.type);
            setParagraph('#myParagraph', event.type)
        },
        mouseleave: function ...
  • JavaScript Event Delegation without jQuery

    jQuery does lots of cool stuff, but it isn't necessary every time. You can get a surprising amount of stuff done with the event object.

    // Starting with a Crockford-style IIFE - http://benalman.com/news/2010/11/immediately-invoked-function-expression/
    (function startDelegating(){
        // Caching these thingies to variables so ...
  • Document Fragment Example

    Adding content in one shot by putting it all into a fragment first.

    /*
    Some stuff on document fragments:
    ==========================================
    https://developer.mozilla.org/en-US/docs/Web/API/Document/createDocumentFragment
    http://ejohn.org/blog/dom-documentfragments ...
  • Throttled Resize Management

    Define a list of things to do on resize and add to it at any time later. Uses Ben Alman's throttle/debounce plugin to keep calls down to once per 250ms.

    var SITE = {
        counter : 0, // Used to update markup on resize so you don't have to look in the console ...
  • Spider-Man Crawls on the Canvas

    Wanted to use a sprite without a library of any kind. Practiced tile animation, translating the context and flipping the image.

      /*
    INSPIRATIONS:
    Structure inspired by:
    	http://viget.com/extend/2666
    Page Visibility API and Polyfill for vendor prefixes:
    	http://stackoverflow.com ...
  • Two arrays, one match.

    Returns true if the dropoff locations have any numbers in common with the pickup locations.

    var isSupplierMatch = function(pu_supp_ids, do_supp_ids) {
        /*
    	This function is for single locations. A supplier ID string is submitted for 
    	the pickup ...
  • Canvas Snow #43 is the latest revision

    Another snowfall example, inspired by the many blizzards which have hit Maine recently. Also making use of the Visibility API, because IE<=9 can go to hell.

    /*
    INSPIRATIONS:
    Structure inspired by:
    	http://viget.com/extend/2666
    Page Visibility API and Polyfill for vendor prefixes:
    	http://stackoverflow.com ...
  • Table Display Tests

    Just playing around with the way lists can be displayed as tables.

    console.log( $('li').height() );