JSFiddle

  • jQuery Hide Show

    jQuery 1.7.2, HTML, CSS, JavaScript, jQuery UI 1.8.18

      $(document).ready(function() {
        $(".back").click(function () {
          $(".focus-me").hide('fade');
        });
        $(".front").click(function () {
          $(".focus-me").show('fade');
        });
    });
  • Bootstrap Carousel w/ Nav

    Twitter Bootstrap Carousel with pagination style nav.

    // invoke the carousel
    $('#myCarousel').carousel({
      interval: 3000
    });
    
    /* SLIDE ON CLICK */ 
    
    $('.carousel-linked-nav > li > a').click(function() {
    
        // grab href, remove pound sign ...
  • flickr photos

    jQuery 1.4.4, HTML, CSS, JavaScript, jQuery UI 1.8.5

    $('#toolbar_add').entwine({
        onclick: function() {
            var tag = prompt('Enter a tag to search Flickr for photos.')
            $('#tags').add(tag)
        }
    })
    $('#toolbar_remove').entwine ...
  • Pure CSS Note Paper

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

    <link href='http://fonts.googleapis.com/css?family=UnifrakturCook:700' rel='stylesheet'>
    
    <article class="notepad">
        <p>This is zombie ipsum reversus ab viral inferno, nam rick grimes malum cerebro. De carne lumbering animata corpora quaeritis. Summus ...</p></article>
  • Print a paragraph

    Print the contents of a specific paragraph

    $(function() {
        var autoPrint = true,
            popupWidth = 500,
            popupHeight = 500,
            printWin = function(el) {
                var msg = el.parent().next('.block'),
                txt = el.text ...
  • css tricks organic tabs #3 is the latest revision

    This demo shows how to make all of the tabs the same height (first line of css). http://css-tricks.com/organic-tabs/

    $(function() {
        $("#example-one").organicTabs();
    });
    
    // organicTabs plugin below
    // http://css-tricks.com/organic-tabs/
    (function($) {
    
        $.organicTabs = function(el, options) {
    
            var base = this;
            base.$el ...
  • PDF Thumbnail of any page #2 is the latest revision

    Mootools 1.4.2, HTML, CSS, JavaScript

    <a href="http://cl.ly/3T2g2x2z3S081X1u2h0B/content" title=""> <img class="locandina" src="http://docs.google.com/viewer?url=http://cl.ly/3T2g2x2z3S081X1u2h0B/content&a=bi&pagenumber=1&w=200" alt="" /></a>
  • Satu Halaman Website Dinamis dengan Efek Sliding

    jQuery 1.7.1, HTML, CSS, JavaScript

    //Adding ScrollTo Plugin, Update Size by Window Size
    
    $(function() {
        
       $('html, body').css('overflow', 'hidden');
        
       function updateSize() {
          var winWidth  = $(window).width ...
  • PDF page #

    google pdf viewer

    var f = $('iframe'), last = 1;
    
    $('input').bind('keyup click', function(){
        var h, indx = parseInt( $(this).val(), 10) - 1;
        indx = (indx ...
  • AnythingSlider playground

    Add, remove, adjust any or all options so you can see how it works.

    $('#slider').anythingSlider({
    
        // *********** Appearance ***********
        // Theme name; choose from: minimalist-round, minimalist-square,
        // metallic, construction, cs-portfolio
        theme: 'default',
        // Set mode to "horizontal", "vertical" or ...