JSFiddle

  • Lorem Ipsum Text

    Mootools 1.4.5, HTML, CSS, JavaScript

    var lorem = document.getElementById('lorem').innerHTML,
        lorem = lorem.replace(/[\.,\n]/g, '').toLowerCase().split(' '),
        word = '',
        list = '';
    
    console.log(lorem);
    
    while (word ...
  • ACE editor demo #1 is the latest revision

    Mootools 1.4.5, HTML, CSS, JavaScript

    <div id="editor">function foo(items) {
        var x = "All this is syntax highlighted";
        return x;
    }</div>
    
    <script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
    <script>
        var editor = ace.edit("editor");
        editor.setTheme("ace ...</script>
  • Countdown script #24 is the latest revision

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

    //window['addEventListener' || 'attachEvent']('load', run);
    
    document['addEventListener' || 'attachEvent']('click', run);
                                                  
    function run(){
        countdown(10, 1000, 'timer');
        document['removeEventListener' || 'dettachEvent']('click ...
  • Autocalling countdown loop #2 is the latest revision

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

    (function countdown(loops, pause, timer, d, g, l, id){
        id = d[g]('timer'); 
        window[l || 'attachEvent']('load', run);
        function run ...
  • Font face demo #1 is the latest revision

    Mootools 1.4.5, HTML, CSS, JavaScript

    <p style="text-align: center;">Font designer: <a href="http://www.cloutierfontes.ca/CloutierFontes/Bienvenue.html">Steve Cloutier / Cloutierfontes</a></p>
    <p class="test">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies enim eget sem consequat ut ...</p>
  • Font face demo

    Mootools 1.4.5, HTML, CSS, JavaScript

    <p class="test">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies enim eget sem consequat ut placerat arcu malesuada. Pellentesque suscipit ...</p>
  • Panel reveal

    jQuery 1.7.2, HTML, CSS, JavaScript

    $('.item h3').click(function () {
        var $detail = $(this).next("div.details");
            
        $("div.details").not($detail).removeClass("display");
        $detail.toggleClass("display");    
    });
  • Javascript Variable Function Expression Scope Illustration #1 is the latest revision

    This fiddle tries to demonstrate the seemingly incongruous behavior of a named function expression not being callable (in a variable, right-hand assignment sense).

    (function() {
        var bar,
            i = 5;
    
        function log(text, func) {
            try {
                console.log(text, ':', func);
            } catch (e) {
                console.log(e);
            }
        }
    
        var ...
  • Fade in box #1 is the latest revision

    jQuery 1.7.1, HTML, CSS, JavaScript

    $(document).ready(function(){
        var $window = $(window),
            $splash = $('.splash'),
            $container = $splash.find('.container'),
            seconds = 5;
        
        var position = function(){
            var position = {
                top ...
  • Fade in box

    jQuery 1.7.1, HTML, CSS, JavaScript

    $(document).ready(function(){
        var $window = $(window),
            $splash = $('.splash'),
            $container = $splash.find('.container'),
            seconds = 5;
        
        var position = function(){
            var position = {
                top ...