Archive for 2015

    FileUploader : HTML5 File Uploader

    FileUploader : HTML5 File Uploader

    FileUploader  is a jQuery file uploader skeleton that uses HTML5 file reader api.

    Create Circular SVG Charts with Circles

    Create Circular SVG Charts with Circles

    A lightweight JavaScript library that generates circular graphs in SVG.The circular graphs with the numerical value in the center have been a great way to visualizing data lately. 

    Labella.js : Placing Labels on a Timeline

    Labella.js : Placing Labels on a Timeline

    If you try to place labels for points on a timeline (or any 1D space), one common problem is the labels often overlap. How about making the labels push each other. Use the force, jedi-style.

    jQuery-DataEntry : Forms Validation Plugin

    jQuery-DataEntry : Forms Validation Plugin

    Forms validation plugin that supports AJAX requests, automatic decoration of fields, localized error messages. Integrable with Angular, Backbone, Knockout.

    Features:

    • Provides a way to implement form validation with little coding
    • Provides a structure to manage the client side validation at application level: keeping it consistent in every form
    • Provides a flexible way to define validation rules, also involving AJAX calls or other asynchronous operations
    • Automatic field decoration
    • Automatic formatting logic

    Interactive Geographical Map with SVG and JavaScript

    Interactive Geographical Map with SVG and JavaScript

    I’ve demonstrated how SVG can be used to create responsive, scalable imagemaps, but have left the interactive part – aside from simple hover effects – largely unexplored, with a few exceptions. That changes with this article and the one following, which explore how to create a full, in-depth interface using SVG and JavaScript: in this case, a geographical map.

    Ultimate Grid Pro with HTML5 & JavaScript

    Ultimate Grid Pro with HTML5 & JavaScript

    Ultimate Grid Pro is indeed the ultimate responsive multimedia grid builder packed with an insane set of features that allows to create unlimited, filterable / sortable multimedia portfolios, product swhowcase, image galleries with unlimited possibilities. It includes five grid types with vertical or horizontal layout variation (dynamic, classic, masonary, flexible and infinite) that allow to display various multimedia content in a highly customizable way. It runs on all major browsers with support for older browsers like IE8 and mobile devices like iPhone, iPad, IOS, Android or Windows mobile.

    Responsive layout. Five grid layouts included with vertical and horizontal variation (dynamic, masonry, classic, flexible and infinite).

    Pro Range Data Slider : jQuery Plugin

    Pro Range Data Slider : jQuery Plugin

    Lightweight HTML5 based range data slider for mobile and desktop that creates data objects from user input and formats as JSON for modern web app’s.A substantial improvement over the data range sliders in jQueryUI and Twitter Bootstrap.

    • HTML5 ready. Use the new elements with confidence
    • A touch friendly data range slider
    • No code bloat
    • Formats input to JSON
    • Tallys amounts from each range slider to provide a total
    • Can be re-styled any way you like in CSS

    Flipside : CSS3 Animated Confirmation Popup

    Flipside : CSS3 Animated Confirmation Popup

    Flipside is a button that seamlessly transitions from action to confirmation.

    Sprite-based Games with HTML5 Canvas

    Sprite-based Games with HTML5 Canvas

    In this article, we’re going to create a 2d game with canvas; a real game with sprites, animations, collision detection, and of course, explosions! What’s a game without explosions?

    StackEdit : Open-source Markdown Editor

    StackEdit : Open-source Markdown Editor

    StackEdit is a full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.