JSFiddle

  • CreateJS moving dots on a line #33 is the latest revision

    CreateJS 2013.09.25, HTML, CSS, JavaScript

    (function(){
    
        var myCanvas = document.getElementById("myCanvas"),
            stage = new createjs.Stage("myCanvas"),
            startPoint = {x:myCanvas.width/2, y:myCanvas.height/2 ...
  • Moving dots on a line. #12 is the latest revision

    No matter where the line is, the dots will go from start to finish. Change the startPoint/endPoint variables to see different results.

    (function(){
    	/* code */
    	var theCanvas = document.getElementById('myCanvas'),
    		context = theCanvas.getContext('2d'),
    		spaceBetween = 20,
    		startPoint = {x:theCanvas.width/2,y:50 ...
  • Toggle Next

    For a set of items that need to toggle their content. Just put "toggler" class on anything that needs to toggle the next div after it.

    $( '.toggler' ).on( "click", function() {
        var $next = $(this).next(); // "$myVariable" is a naming convention for variables that are jQuery objects.
    	if ...
  • Single container waiting indicator

    Forked from Jeff's fiddle.

    	function spinner_example(container_id)
    	{
            // Here's a string to plant in a div:
            var spinnerString = '<div id="container_waiting_indicator" class="container_waiting_indicator_overlay">' + 
                                '<img class="container_waiting_indicator_overlay_image"' +  'src="http://webres.aemaine.com/img/ui/spinner.gif">' + 
                                '</div>';
    
            $("#container_waiting_indicator").remove(); // Remove existing indicator. In ...
  • SVGJS Testing

    Just looking through the docs and playing around with the framework. http://www.svgjs.com/

    // http://documentup.com/wout/svg.js
    
    /*  This line sets the viewbox, which sort of creates a boundary that the SVG ...
  • Timer Class

    Just a thing I had to make for work. Thought I would post it somewhere, and it seems a bit small to put on its own GitHub page.

    /* ================== */
    /* TIMER CLASS        */
    /* ================== */
    var Timer = function (option) {
        var self = this,
            until, autostart = true;
        if (!option.until) {
            until = false;
        }
        if (option.autostart ...
  • Toggle Cousin

    Use a button to show/hide another element in the same container, whether or not it's a direct sibling.

    $('.total-container').on( "click.namespace", "div, button, a", function() {
        console.log("You've clicked on something inside the total container.");
    
        
    // Only ...
  • Bouncer

    Just a performance tester. You can add any number of bouncers and see the resulting frame rate.

    //==========================================
    $(document).ready(function() {
    	/* All site-specific javascript */
    	bouncerApp();
    });
    //==========================================
    
    
    function canvasSupport() {
    	return Modernizr.canvas;
    }
    
    
    function bouncerApp() {
    //====================
    	//if (!canvasSupport()) {
    	//    return;
    	//}
    	var theCanvas = document ...
  • Return Another Function

    Playing around with private vs. public variables.

    function returnAnotherFunction() {
        var testStuff = "The function was invoked.";
        function changeText() {
            document.getElementById('targetText').innerHTML=testStuff;
        }
        return changeText();
    }
    returnAnotherFunction();
    
    
    
    function counter ...
  • Toilet Check

    Basic syntax drill, with amusing subject matter.

    'use strict';
    var resultParagraph = document.getElementById('toilet-results'),
    		statsParagraph = document.getElementById('toilet-stats')
    
    // Change these arrays to alter the capacity and/or ...