Comparing and cloning objects in JavaScript
Two simple functions for comparing and cloning JavaScript objects without requiring a framework like jQuery.
TextAreaExpander Class for MooTools
It does exactly what is says: expand textareas. No more, no less.
Rounded corners on images using CSS3
Most browsers do not allow images to be cropped using CSS3’s border-radius. Tim Van Damme recently posted a workaround for this issue. Here’s a MooTools script that automates Tim’s workaround yet degrades gracefully when JavaScript is disabled.
JavaScript removeClasses utility
MooTools’ removeClass utility will only work if the classes you want to remove are listed in the same order as the target element’s className property. Here’s a new removeClasses utility that fixes this shortcoming. A framework-neutral version is also provided.
CustomInput Class: Accessible, Custom-Styled Checkboxes and Radio Buttons
I’m currently working on a new quiz system at work, and decided I’d incorporate Filament’s wonderful stylized checkboxes and radio buttons into my project, which meant it was time to roll up my sleeves and code me some Moo.
Image-Free Progress Bar using MooTools and Canvas
As part of my ongoing experiments with
Custom modal windows using canvas and MooTools
I’ve built a simple modal window class named Modal using MooTools. This class combines a dynamic canvas drawing API (my Rectangle class) with dynamic DOM element generation to create on-demand modal windows using no external images. My goal was to make this about as easy to use as a normal JavaScript alert, prompt or confirm window.
Fun with canvas and MooTools: a Rectangle class
Recently at work I realized I needed a good modal window that was more extensible than JavaScript’s built-in confirm and prompt windows. MochaUI looked like a handy way to get slick modal windows into my project, but I soon realized that MochaUI is designed to do much, much more than I need, and therefore is (for my purposes) bloated. So, in typical DIY fashion here at pipwerks, I decided to borrow a page from Greg’s book and make my own MochaUI-inspired modal window using the canvas element, CSS, HTML, and MooTools. After evaluating what I’d need for my little modal window, I whipped up a MooTools-based JavaScript class that produces canvas rectangles in the blink of an eye.
Obfuscating email addresses, revisited
A while back, I posted my method for defeating spambots that harvest email addresses. This post is an update to that original method. It explores cleaner, less obtrusive code approaches and more accessible/usable HTML markup.
Dealing with Internet Explorer in your JavaScript Code
It’s almost the end of 2008, and thanks to the hard work of web standardistas, browser vendors, and JavaScript framework developers, cross-browser JavaScript code is much less of an issue than it used to be. Even Microsoft is feeling the love — the upcoming Internet Explorer 8 will be a (mostly) clean break from legacy Internet Explorer releases and will behave much more like Firefox, Safari (WebKit) and Opera. …And they rejoiced.
So why is it that when I look under the hood of some recently produced web pages (learning management systems, courses produced by e-learning rapid development tools, general web pages, etc.), the pages’ JavaScript often includes incredibly out-of-date and bad-practice Internet Explorer detection?
Here’s a quick rundown on the dos and don’ts.