Whitney Krape

Tag: jQuery

The fabulous JavaScript library. Little pieces of wisdom learned along the way.

  • Stack jQuery events on elements to avoid delays.

    While building a bit of code for phlodl.com jQuery was acting up when adding a simple mouseover to expand and the event was delayed when the mouse entered the element. To fix this I daisy-chained the events on the element to fix the delays:

    Delayed animation:

    $('.feature').mouseenter( function() {
    $(this).animate({
    height: 540
    }, 'fast', function() {});
    });

    $('.feature').mouseleave( function() {
    $(this).animate({
    height: 300
    }, 'fast', function() {});
    });

    Seamless:

    $('.feature').mouseenter( function() {
    $(this).animate({
    height: 540
    }, 'fast', function() {});
    }).mouseleave( function() {
    $(this).animate({
    height: 300
    }, 'fast', function() {});
    });

  • Dynamically generated HTML5 manifests

    Dynamically generated HTML5 manifests

    In the specification for HTML5 several methods for storing data locally are outlined including localStorage and manifests. While building out the offline storage for Animatic Builder, I attempted to keep the stored data dead simple; as in the case of the shot information which is stored as one long JSON string. In this way the shot data can be pulled into any other use by reading the string. Keeping the images stored proved more difficult due to the number, potentially hundreds, and their format as many separate files. As well as making sure the storage is universal on mobile and full client systems. (more…)