Category Archives: Java Scripts

Image Effects With JavaScript

PaintbrushJS is a JavaScript library for applying effect to images on the client-side.

It makes use of the canvas element and works by applying a class to an element on the web page and setting few parameters with some extra HTML attributes.

The filters it supports currently are: blur, grayscale, mosaic, noise, posterize, sepia and tint.

JavaScript / PHP Image Manipulation : Phototype

Phototype is a client/server-side image manipulation library, based on Prototype and supports all kinds of image manipulations.

How it works?

Clientside JavaScript codes sends the commands to the serverside PHP – GD library image renderer and displays the rendered image.

Using Phototype, you are able to rotate, resize, flip and do some other cool effects to images.

Free JavaScript Image Manipulation

CamanJS is a JavaScript image manipulation library that makes use of HTML5 <canvas> tag.

With a simple-to-use interface, advanced filters including saturation, contrast, gamma, brightness or exposure can be applied.

It has a layer system -similar to the ones in Photoshop or GIMP- that creates so many possibilities.

The library can be extended with new plugins and filters where a detailed “how-to” exists on that subject.

CamanJS is standalone, can be safely used with any other JavaScript libraries and also has a NodeJS-compatible version.

Free JavaScript WYSIWYG Editor: TinyEditor

TinyEditor is a lightweight (8kb) JavaScript WYSIWYG editor that is free to use in both personal & commercial projects.

It is a standalone script (does not require any JS frameworks) & converts any given textarea to an editor

The can be easily customized by updating the parameters (like removing some of the controls). And it is possible to style it via CSS:

TinyEditor can be resized, a starting content can be defined, set to generate HTML or XHTML code & more..

Extensible jQuery WYSIWYG Editor – CLEditor

CLEditor is a lightweight jQuery plugin for adding WYSIWYG HTML editors on web pages.

The plugin works by converting a standard textarea element and it is cross browser.

It is fully customizable like adding/removing/updating controls, enable/disable the use of CSS and much more.

Also, the WYSIWYG editor can be controlled with a set of methods provided.

CLEditor is very well-documented and comes with optional add-ons like “table plugin (visually displays tables inserted)” and “icon plugin (for seeing the smileys inserted)”.

Requirements: jQuery
Compatibility: All Major Browsers

WYSIWYG Editor With A File Manager: elRTE

elRTE is an open source and feature-rich WYSIWYG editor that is built using jQuery UI.

It performs all standard functions of an editor and has all the extras like undo-redo, advanced table management, creating a custom HTML element with a custom style + inserting it quickly and more.

The interface is controlled via a single CSS file and can be customized pretty easily.

QueryLoader – is a preloader script

The QueryLoader plugin for jQuery is a preloader script which loads content of your website. The plugin loads text content, all inline images and backgrounds from your linked CSS stylesheets. It contains a stylish progress loading bar and animation for page appearance.

Mac OS Style DockMenu in pure Javascript.

The UvumiTools DockMenu for Mootools reproduces Mac OS dock in pure Javascript.The UvumiTools DockMenu for Mootools reproduces Mac OS dock in pure Javascript.

To see this plugin in action, click the “Demo” button and check out the bottom of your browser window: it’s a horizontal menu, with icons growing up when you hover them with your mouse. As you would expect from an UvumiTools plugin, the whole thing is degradable, built from standard HTML, and is cross-browser compatible.

simple multi-level menu

Description

This Mootools plugin provides a very simple multi-level menu built from an HTML unordered list. The plugin supports horizontal and vertical modes.

jQuery lightbox

Description

jQuery lightbox plugin is a simple, elegant way to display your photos.jQuery lightbox plugin is a simple, elegant way to display your photos. Photos are loaded via AJAX and displayed in overlay on the same page. View demo to see the plugin in action.