JSFiddle

  • Hiding an element

    This fades out an element with CSS and then really hides it with a tiny bit of JavaScript.

    (function () {
        var hideElement = document.getElementById('hide'),
            textElement = document.getElementById('text'),
            transitionClass = 'hide',
            hideClass = 'hidden';
        
        bindClickToHideElement(hideElement, textElement, transitionClass, hideClass);
        
        function ...
  • Object.create construct.name wrong #2 is the latest revision

    Mootools 1.4.5, HTML, CSS, JavaScript

    (function() {
      function Foo() {}
      
      function Bar() {}
      Bar.prototype = Object.create(Foo.prototype);
      
      var t = new Bar();
      console.log(t.constructor.name ...
  • Capturing link clicks #7 is the latest revision

    Mootools 1.4.5, HTML, CSS, JavaScript

    document.addEventListener('click', function (evt) {
      bubble(evt.target, function (e) {
        console.log(e);
      });
      
      evt.preventDefault();
    });
    
    function bubble(e, cb) {
      cb ...
  • EventEmitter running off of the DOM

    An EventEmitter class using the DOM to manage it.

    /**
     * EventEmitter running off of the DOM.
     * Oliver Caldwell.
     * 
     * https://gist.github.com/4530132
     */
    (function (exports) {
      /*global document*/
    
    	/**
    	 * Creates an instance ...
  • Using line clamp

    WebKit made up a property called line-clamp and then didn't document it. So here is how you use it.

    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget ...</p>
  • Prototypical inheritance #5 is the latest revision

    Just messing about with the prototype. Looking into nice ways of extending and implementing classes without a library.

    
    
  • EaselJS experiments #1017 is the latest revision

    Just playing with EaselJS. http://www.createjs.com/#!/EaselJS

    var stageWidth = 640;
    var stageHeight = 480;
    
    var stage = new createjs.Stage(document.getElementById('display'));
    stage.enableMouseOver();
    
    var shape = new createjs ...
  • EventEmitter once loop bug

    https://github.com/Wolfy87/EventEmitter/issues/26

    var foo = new EventEmitter();                                                                                                                 
    foo.once("foo", function () {
        console.log("foo handler");
        foo.removeAllListeners();
    });
    foo.emit("foo");
  • Grid to test rounding

    Testing rounding in CSS.

    
    
  • CSS grid preview #8 is the latest revision

    Grid previewer for http://oli.me.uk/outline/