Andrew I. Carlson

As I've mentioned before, we use jQuery Validate on most sites that we build at work. When validating forms it's important to do more than just verify that the fields contain values that you'd expect. We should also be testing to verify that the form isn't spam with a server-side solution like Akismet. That works great… Continue reading Combining Google’s re(no)CAPTCHA and jQuery Validate →

When using JavaScript's .sort() to sort an array of objects alphabetically, remember to set each string to lowercase or uppercase before you compare it. This will correct the priority that JavaScript gives capitalized letters over lowercase letters. For example, instead of: var defaultParent = $('.default-sort'); var defaultItems = defaultParent.children('li'); defaultItems.sort(function(a, b) { x = a.getAttribute('data-sort'); y… Continue reading Sorting alphabetically with mixed case letters →

Margin collapsing is a tricky thing that usually pops up at the worst time. I've had issues with it when laying out content for a something like a slideshow hero where there will be multiple images and text containers per slide and the content below the slide needs to be brought up to lay over top… Continue reading When Margins Collapse →

The problem: Create a function such that each row on a page has a static number of images (let's say 3) of unknown dimensions where the images are resized such that the widths are equal to a dynamically defined width and the heights of each image are equal to all other images in the row… Continue reading Resizing Images Based on Other Image Heights →

When working with 3D animations with CSS, one thing that is rarely mentioned is that CSS3's perspective property is largely linked to the element height. This is likely because it normally wouldn't be an issue. Applying perspective to an element wrapping a transformed element or group of transformed elements forces the elements to behave similarly and all 'start' from… Continue reading Variable CSS Perspectives and Transform-Functions →

It's actually easier than it sounds, and once you understand the basics you can likely do most conversions mentally. The goal is to take a color in the RGB format, 3 groups of integers 3 digits long (eg: 111, 222, 123) and convert it to the hexadecimal equivalent. Hexadecimal is essentially a different way to… Continue reading Explaining the Hex Color Format (and how to convert to it) →

I recently took my first foray into converting colors with JavaScript. I found myself constantly searching Google for a good online color conversion between RGB and hex. Opening up PhotoShop or another image editor every time I needed a color converted was unrealistic, and if I was developing in the browser it made sense to… Continue reading Color Conversion Tool →

At work we build most websites using Bootstrap as the base for the responsive grid, Bootstrap-select to style HTML <select>'s and jQuery Validate for form validation. Turns out, the three of these don't necessarily play well together out of the box. jQuery Validate works in two ways. It starts off lazy by waiting for the user to submit a… Continue reading Using Bootstrap-select (selectpicker) and jQuery Validate →