Connect With WRD
feed via e-mail
feed via e-mail

Archive for the ‘Goodies’ Category

js-hotkeys is a jQuery plugin which enables you to create keyboard triggered events.

Update: The plugin is based on shortcut.js. You may want to use this for not being restricted with jQuery.

This is a very nice feature if you want to provide users more browsing flexibility. And also, it can be used in JavaScript testing environments like triggering a test function by clicking CTRL + t.

JavaScript Keyboard Control

A simple usage of the plugin is:

$.hotkeys.add('Ctrl+a',function(){/*DO YOUR DUTY*/});
$.hotkeys.remove('Ctrl+a');

A demo of this jQuery keyboard control plugin can be found here.

woork presents a nice MooTools news ticker, which scrolls vertically, similar to the one in Newsvine.

Mootools News Ticker

Content is currently hard-coded inside the HTML within li elements. There is also an information provided for how to get the content dynamically from a database.

Speed & delay of the slide effect can be configured within the code.

Spacegallery is a very simple but nice image gallery built with jQuery.

It is a static gallery where images are hardcoded in the HTML and presented with a beautiful grow – fade out effect.

jQuery Image Gallery

How to use?

After inserting the JS & CSS files into your webpages, create a div element with images inside like:

<div id="myGallery" class="spacegallery">
    <img src="images/bw3.jpg" alt="BW" />
    <img src="images/lights3.jpg" alt="Lights" />
</div>

And call the gallery:

$('#myGallery').spacegallery({loadingClass: 'loading'});

You can also configure the perspective, border & animation duration.

MooColumns is a Mootools class that helps creating multiple-column contents easier & quicker.

It automatically divides the contents into columns and supports multiple instances to be run at the same page.

Mootools Columns

MooColumns is highly configurable. You can mention the classes which the column-creation will be applied, specify column-break elements, number of columns & column widths. Or leave all these settings to the default ones.

This Mootools class is currently in beta but looks promising and very functional for presenting the content.

FotoViewr is a web-based image gallery application which enables you to create 3D image galleries for your Flickr account.

You can choose to present your images from 6 different 3D gallery types.

Flickr Image Gallery

Galleries can be created instantly by simply providing your Fickr username (no password required) and the applications lets you select which gallery to display.

After the Fickr gallery selection, FotoViewr provides you the embed code you need to insert into your webpage to display the gallery & that’s it.

Tip:

FotoViewr also has a Facebook application to use with Facebook galleries.

jqPuzzle is a jQuery plugin which enables you to create sliding puzzles from any image.

The created JavaScript puzzle can have the shuffle & solution options besides the moves made & seconds played.

JavaScript Puzzle

jqPuzzle is highly configurable as the options in the interface can be enabled/disabled, number of rows & columns of the puzzle to be created can be defined & more.

How to use?

After inserting the jquery.jqpuzzle.js & jquery.jqpuzzle.css files to your webpage, simply give the class="jqPuzzle" to any image. That’s all.

LimeSurvey is an open source PHP survey application which has almost every feature you may need.

It enables you to create conditional (questions change depending on the previous answers), open/close group surveys with e-mail invitations, reminders & more.


This PHP survey application is completely multilingual and currently supports 46 languages. Any survey can be created to support more than 1 language.

Templates can be created and any survey can be choosen to work with that template to match the design of the websites.

Some features of LimeSurvey:

  • Unlimited number of surveys at the same time
  • Unlimited number of questions in a survey
  • Unlimited number of participants to a survey
  • Multi-Lingual Surveys
  • User-Management
  • 20 different question types with more to come
  • WYSIWYG HTML Editor
  • Quotas Management
  • Integration of pictures and movies into a survey
  • Creation of a printable survey version
  • Option for participants to buffer answers to continue survey at a later time
  • Survey expiry dates for automation
  • Enhanced import and export functions to text, CSV, PDF, SPSS, queXML and MS Excel format
  • Basic statistical and graphical analysis with export facility
  • Screen Reader Accessiblity
  • W3C compliance

CRIR is a combination of JavaScript & CSS that enables you to create custom checkbox and radio buttons.

Note: Seems like the website is currently down. Click here for the cached version from Yahoo.

Custom Checkbox And Radi Button

Behind the scenes, CRIR does it with a visual trick by hiding the original form elements (but transferring any values to them) and replacing them with images.

jQuery Sparklines is a plugin for creating sparklines on the fly.

What is a sparkline:

Sparklines

They are data-intense, design-simple, word-sized graphics that are commonly used in market, stock activity and can be implemented anywhere (via Wikipedia).

This plugin supports:

  • Line graphs
  • Bar charts
  • And, tristate charts

jQuery Sparklines

jQuery Sparklines plugin can be used to create graphs from data inside the HTML or via JavaScript. Almost every variable of it can be customized including colors, size & chart type.

PostcardViewer, similar to AutoViewer (see WRD post) which is created by the same company, is a free Flash image gallery application with a very nice presentation.

Flash Gallery

The interface is just like a set of postcards shuffled onto a surface & this is supported with the effects.

This Flash gallery can controlled via mouse & keyboard. And it displays image captions (including URLs).

Besides this free version, pro version offers more customization and no backlink.

  • Tags:
  • Filed under: Goodies, Other License
  • 2 Comments
  • Uptime Robot
    feed-holder
    FeedBurner
    PSD2HTML.com