jQuery 3.0 alpha released

It’s probably gonna be a big deal.

Previous to this, jQuery 1.x was the IE8-compatible version and 2.x was the forward-looking version which only worked in IE9 and modern browsers. This was confusing to a lot of newcomers who just assumed that 2.x was the latest and greatest version, so now we have”jQuery Compat” 3.x and jQuery 3.x instead.

Please note that there are some breaking changes, plus this is an alpha release, so don’t do anything reckless like using it in production untested.

Nine reasons NOT to use a CMS

This article is relevant to my interests. I’ve spent the last couple of months learning my way around Drupal 7 and the Panopoly distro (and waiting patiently for Drupal 8 to be ready to use), and it seems like every time I think I’ve finally got the hang of it, I find something new to try out.

Nevertheless, my employer’s primary marketing angle is that we create custom-built websites from scratch to meet our clients’ specific requirements, and I’m still the most comfortable when I can get straight into the HTML, CSS, JavaScript, PHP and SQL code to make things just right. Like it or not, using a CMS means accepting a few limitations. And with some clients, those limitations can be deal-breakers.

force browsers to print background colors of elements

Most browsers won’t print background colors, and print-only CSS can (or should) be set to force all text to be black so it looks good on a white background. But what about images? What if you have a logo with white text and a transparent background that’s normally displayed over a dark background? Webkit browsers support the -webkit-print-color-adjust: exact style, but that still leaves out Firefox. Continue reading

Autocomplete forms

The easier it is to fill out forms automatically, the more likely you are to get users to submit them. But nobody likes filling out forms, and autocomplete is getting smarter and smarter — but in my experience, it’s rarely perfect. So it’s nice to know that the HTML standard has added an autocomplete attribute to form fields that makes it easier for browsers to guess what data goes where.

Google has announced that Chrome now fully supports this spec, and there’s another page for developers that talks about how to make forms friendlier.

multi-select with checkboxes

If you have a very long list of options, neither <select multiple> nor <input type=”checkbox”> is quite ideal. This combines the two using jQuery.

When an option is selected, a checkbox (with label) is automatically created using the same “name” and “value” attributes. When the checkbox is un-checked, it fades away (after a brief delay) and is re-attached to the single-select.

Note that this uses progressive enhancement; if JavaScript is disabled, an ordinary <select multiple> will be provided. If some options are already selected in the HTML, those are extracted as checkboxes automatically. The “required” attribute is also passed along to the checkboxes, if set in the <select>.

Using CSS to “count” elements in a group

A List Apart has an article today about how you can use CSS selectors creatively to “count” the number of elements inside another element. This would be useful if, for instance, you wanted to style elements of a list differently when there’s more than six of them in the list.

Here’s the CodePen if you just want to see it in action.

Parallax done “right”

I put “right” in quotes because, well, I’m opposed to gimmicky animations in web pages on principle. However, if you have to use them, they should be done efficiently.

To that end, I found this article on Medium from May 2014 that has a series of tips, at least four of which I’ve put into effect just this morning and one of which I never even knew existed before today.