JSFiddle

  • Google Maps Rectangle #1 is the latest revision

    jQuery 1.8.3, HTML, CSS, JavaScript

       function initialize() {
         var map = new google.maps.Map(document.getElementById('map'), {
           zoom: 7,
           center: new google.maps.LatLng(47.5 ...
  • Simple Template Events

    Callbacks and event listeners via simple DOM data attribute lists

    var log = document.getElementById( 'log' );
    var nodeIterator = document.createNodeIterator(
        document.getElementById( 'template' ),
        NodeFilter.SHOW_ELEMENT,
        {
            acceptNode : function( node ) {
                return node.attributes ...
  • JS Object Storage #7 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    // https://developer.mozilla.org/en/docs/Web/Guide/API/DOM/Storage
    // http://www.w3schools.com/html/html5_webstorage.asp
    // https://developer ...
  • Typo Tilt-Shift CSS #2 is the latest revision

    Typography CSS Animation with data-text Attribute and the CSS IE compatible attr() in use.

    <div class="glitch" data-text="Hello">Hello</div>
  • Data Behavior #11 is the latest revision

    Plain JS event listener running on a node iterator

    var currentNode,
        nodeIterator = document.createNodeIterator( 
            document.documentElement,
            NodeFilter.SHOW_ELEMENT,
            function( node ) {
                return node.hasAttribute( 'data-behavior' );
            }
        );
    
    while ( currentNode = nodeIterator.nextNode() ) {
        currentNode ...
  • Geolocation API Test

    http://www.w3schools.com/html/html5_geolocation.asp

    "use strict";
    
    var center = new google.maps.LatLng(48.2, 16.4),
        markerImage = {
            path: google.maps.SymbolPath.CIRCLE,
            scale: 0 ...
  • Moving map in Circle w border

    Animating map inside a circle - clickable. Has a cloudLayer and Satellite map type for enhanced realistic display.

    ( function() {
        "use strict";
    
        var center = new google.maps.LatLng( 24.879316, 14.485368 ),
            markerImage = {
                path         : google.maps.SymbolPath.CIRCLE,
                scale ...
  • Google Maps Tile Shift Bug Issue #4070 #7 is the latest revision

    Confirm Tile shifting on Google Maps Issue #4070 https://code.google.com/p/gmaps-api-issues/issues/detail?id=4070&q=apitype%3AJavascript3%20type%3ADefect&sort=-stars&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Internal%20Stars

    var center = new google.maps.LatLng(
    33.501472920248354, -82.01948559679795),
        map = new google.maps.Map(
        document.querySelector('#map'), {
            center: center ...
  • Google Maps Spherical ComputeArea #37 is the latest revision

    Proof that the bug report is right: Issue #5624 https://code.google.com/p/gmaps-api-issues/issues/detail?id=5624&q=apitype%3AJavascript3%20type%3ADefect%20contains&sort=-stars&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Internal%20Stars

    "use strict";
    
    var Glasgow = new google.maps.LatLng( 55.874, -4.287 ),
        map = new google.maps.Map( 
            document.getElementById( 'map ...
  • Colored Google Maps LatLng Bounds #15 is the latest revision

    Proof that the bug report is right: Issue #4813 https://code.google.com/p/gmaps-api-issues/issues/detail?id=4813&q=apitype%3AJavascript3%20type%3ADefect%20bounds&sort=-stars&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Internal%20Stars

    "use strict";
    
    var Vienna = new google.maps.LatLng( 48.2081743, 16.3738189 ),
        map = new google.maps.Map( 
            document.getElementById( 'map ...