Archive for 2011

    Bootbox.js – alert, confirm and flexible dialogs for twitter’s bootstrap framework

    jquery alert, confirm and flexible dialogs for twitter's bootstrap framework

    I’ve been using twitter’s bootstrap framework for a number of site builds recently, mainly because it gets me from black-and-white markup to vaguely-presentable websites in a very small amount of time. Version 1.3 introduced some JavaScript plugins to complement the array of stylistic elements it already provided – notably code to invoke dialog boxes, or modals…

    jQuery Html5 Canvas Preloader

    jQuery Html5 Canvas Preloader

    Now you can preload your HTML 5 page with this nice plug in, passing data via JSON. You can customize it changing colors and style. It can preload video, audio, images and js

    jQuery colResizable – resize table columns easily

    jQuery colResizable - resize table columns easily

    colResizable is a jQuery plugin designed to enhance any kind of HTML table object adding column resizing features by dragging column anchors manually. It is tiny in size (2.8kb) and it doesn´t require any other library dependencies such as jQuery-UI or others. It is fully compatible with all major browsers(IE7+, Firefox, Chrome and Opera), and works perfectly with both percentage and pixel-based table layouts.

    Chained AJAX Selects in jQuery

    Chained AJAX Selects in jQuery

    In today’s tutorial, we will build a set of chained select elements. Selecting an option in one of them will trigger an update on the page, showing you more choices to refine your selection. We will describe the options server side with PHP, so it is easy for you to hook today’s example to a database.

    BIGrid a Fixed Rows & Fixed Columns table in jQuery

    BIGrid a Fixed Rows & Fixed Columns table in jQuery

    BI Grid is designed to present your data, especially in the reports for enterprises.The idea comes from the BI system I produced months ago. It would be able to edit data easily, drill down to details easily and ajax enabled. Other good features will be supported in the future.

    Features to be supported:

    • It has two modes: View & Edit. The edit mode enable users to edit the data in the grid through Ajax.
    • Init data by using Ajax.
    • Drill down to details by using Ajax.
    • Support JSON & XML data types.
    • Support Multi-skins.

    XML Tree with jQuery

    XML Tree with jQuery

    XMLTree is a utility for visualising and traversing XML in tree format.

    The script creates the tree from a specified XML file or from manually-fed XML. Callback functions can be specified to fire as you traverse the tree, to which are automatically passed the node you clicked, and its XPath.

    jTable A JQuery plugin to create AJAX based CRUD tables

    jTable A JQuery plugin to create AJAX based CRUD tables

    jTable is a jQuery plugin that is used to create AJAX based CRUD tables without coding HTML or Javascript. It has several features including:

    • Automatically creates HTML table and loads records from server using AJAX.
    • Creates ‘create new record’ jQueryUI dialog form. When user creates a record, it sends data to server using AJAX and adds the same record to the table in the page.
    • Creates ‘edit record’ jQueryUI dialog form. When user edits a record, it updates server using AJAX and updates all cells on the table in the page.

    Scrollable Fixed Header Table – A JQuery Plugin

    Scrollable Fixed Header Table – A JQuery Plugin

    This plugin allows html tables to be scrollable horizontally and vertically while headers are still visible and in tack with the columns. This plugin can be used in two modes:

    • With column select – Columns to view can be selected. The select state can be persisted in a named cookie.
    • Without column select

    jQuery Sparklines Graph

    jQuery Sparklines Graph

    This jQuery plugin generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript.

    The plugin is compatible with most modern browsers and has been tested with Firefox 2+, Safari 3+, Opera 9, Google Chrome and Internet Explorer 6, 7 & 8.

    jTicker – Text in a ‘ticker tape’ style

    jTicker – Text in a ‘ticker tape’ style

    jTicker takes an elements’ children and displays them one by one, in sequence, writing their text ‘ticker tape’ style. It is smart enough to ticker text from an element heirarchy, inserting elements back into the DOM tree as it needs them. That means almost any content can be ‘tickered’.