LiveValidation is a small open source javascript library for making client-side validation quick, easy, and powerful. It comprises of two main parts. Firstly, it provides developers with a rich set of core validation methods, which can also be used outside the context of forms. Secondly, it provides your visitors with real-time validation information as they [...]
Design Elements, Forms, jQuery
Custom Checkbox with jQuery
Provides you with the ability to customize the design of Checkboxes in your web forms. You can use the default skin and the Safari skin which are provided with the package.
Design Elements, Forms, jQuery
Masked Input Plugin
A masked input plugin for the jQuery javascript library. It allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phone numbers, etc). It has been tested on Internet Explorer 6/7, Firefox 1.5/2, Safari, and Opera.
Design Elements, Gallery
Cross Browser Multi-Page Photograph Gallery
Hovering over the tabs changes the category, while hovering over an image enlarges it.
Design Elements, Gallery
Hoverbox Image Gallery
A pure CSS-based gallery; hovering over an image enlarges it.
CSS Techniques, Menus
Design Watercolor Effect Menu
This is a two-part tutorial on how to create an artistic and un-typical CSS list menu as seen on Web Designer Wall. In the first part (this article), you will learn how to design a watercolor effect menu in Photoshop.
CSS Techniques, Image Effects
CSS Gradient Text Effect
Do you want to create fancy headings without rendering each heading with Photoshop? Here is a simple CSS trick to show you how to create gradient text effect with a PNG image (pure CSS, no Javascript or Flash).
CSS Techniques, Positioning
Understanding CSS Positioning part 1
Without a doubt, positioning, or the layout, is the hardest part of CSS. Not only because it ever so often varies between browsers, but also because CSS has a lot of ways to position an element, all with various (dis) advantages. This part will introduce the positioning and display property.
CSS Techniques, Image Effects
CSS Decorative Gallery
How to decorate your images and photo galleries without editing the source images. The trick is very simple. All you need is an extra <span> tag and apply a background image to create the overlaying effect.
CSS Techniques, Image Effects
CSS Watermark
CSS Watermark is an unobtrusive and easy way for creating watermark (crossbrowser semi-transparent text) effect on your website’s images. You may choose between four standard and easy applicable text positions - top-left, top-right, bottom-right and bottom-left over the image. On the demo page of CSS Watermark you may use the watermark configurator, that will generate [...]
Javascript, JavaScript Library
Staff Paper Wizard
An AJAX staff paper wizard (music notation wizard), written entirely in JavaScript, CSS and XHTML I wrote some time ago.
Design Elements, jQuery
JQ - Highlight / Fade / Transition Element
Fading from one colour to any other at any speed and interval of colour update with a customizable colour progression tactic. For the sake of brevity, the settings Object argument may be replaced with a start colour value for simple highlightFades. For example: $(‘p.red’).highlightFade(‘red’) to do a red highlightFade. Many setting defaults are customizable via [...]