Tag Archives: jquery

JQuery function to absolutely position elements in a table cell

While table cells in HTML may look like block elements, they’re not, and thus you can’t absolutely position things inside them. I’ve been using a script that I’ve had for ages to get around this. The script would add a helper div around the contents of every cell that was relatively positioned. The benefit of my old script was that it was library independent. The drawback was that it was long, I don’t know who wrote it, it added a div to every TD and TH, and it resisted all efforts to make it target only tags with specified classes.

I retired that script today in favour of iWouldLikeToAbsolutelyPositionThingsInsideOfFrickingTableCellsPlease() over at CSS-Tricks. I renamed it to cellPos(), though.

Weekly link dump

SocialCount

Despite pointing out that “Share this” buttons on most sites live between 0-24 shares, I still get plenty of requests for them. Next time I think I’ll forgo AddThis for SocialCount. It’s very lightweight (provided you’re already including JQuery), customizable, and loads in such a way that it won’t block the display of your content.

Sharpologist

When I switched from plasticy, billion-bladed abominations to safety razors, I used Mantic59’s YouTube channel. Now he has a group blog, and it’s really informative.

Back to Work’s Three-parter on Getting Things Done

Merlin and Dan have started a refresher on David Allen’s productivity classic Getting Things Done. Worth a listen, and the show notes are brilliant.

Validating Canadian Postal Codes with the JQuery Validation Plugin

If you’re using the JQuery Validation Plugin, you can use the following code snippet to validate a Canadian postal code:

jQuery.validator.addMethod("cdnPostal", function(postal, element) {
    return this.optional(element) || 
    postal.match(/[a-zA-Z][0-9][a-zA-Z](-| |)[0-9][a-zA-Z][0-9]/);
}, "Please specify a valid postal code.");

Then use the following rule:

$("#form").validate({
    rules: {
        postal_code: {
            required: true,
            cdnPostal: true
        }
    }
});