Rob Tarr ran some benchmarks to prove the claim that chaining jQuery selector methods is faster than placing them all in a single method call.
Category Archives: JavaScript
Passing Extra Arguments to a jQuery Event Handler
This Fiddle shows how to pass extra parameters to an event handler function in jQuery.
Why Hash-bang URLs are Bad
WebMonkey has a good article explaining why hash-bang URLS are a bad idea. If you’re not familiar with them, they have #! symbols at the beginning of the path, e.g. http://twitter.com/#!/username. They rely entirely on JavaScript to parse and therefore make the site inaccessible to browsers without JavaScript (or those with it turned off by the user), assistive technologies […]
Preventing Sites From Opening New Tabs/Windows
UPDATE: There’s now a Chrome extension called TheOne which does this, so you don’t need to create your own user script. I wrote earlier about why it’s wrong for websites to force links to open in a new tab or window, but it’ll probably be at least a few years before the majority of […]
My First Shot at Adaptive Images
One of the first problems you run into when trying to build an adaptive layout is that images, unlike blocks of text, have fixed widths. Ideally we want to use small images on small screens and full sized ones on larger screens. The browser can resize the image on the fly, but the two problems […]
Passing Multi-Dimensional Arrays from WordPress to JavaScript
On its own wp_localize_script() can’t handle multi-dimensional arrays, but you can get around that by encoding the child arrays in JSON. That doesn’t handle HTML content very well, though, so another way to do it is to use the l10n_print_after parameter. That’s kind of ugly, but it seems like the best way available right now. It […]
admin-ajax.php Response Fails When Called from Domain Alias
I’m writing a WordPress plugin that uses AJAX and I had everything setup and working fine for awhile. I came back to the code a few hours later and all of the sudden I was getting a failed response, even though the code hadn’t changed. I got the correct JSON response when I loaded the […]
jQuery document.ready() Fires Twice
There’s a bug in jQuery 1.4.3 that causes document.ready() to fire twice if there’s an unhanded exception. You can avoid it by wrapping the code that is throwing the exception inside a try/catch block.
Associative Arrays in JavaScript
JavaScript doesn’t support true associative arrays, but because data types are defined as objects, the common syntax works. This is a bad practice, though. You should just create a new object.
IE Pixelates Text During Javascript Animations
If you’re performing a JavaScript animation effect on an element (e.g., jQuery’s fadeIn/fadeOut), you may notice that the text briefly pixelates in IE. You can fix that by setting a background color on the element.
Cross-Domain AJAX Requests
Browsers prevent standard AJAX calls across domains for security reasons, but you can make JSONP calls instead. If you’re using jQuery you just need to add ‘callback=?’ to the url: $.getJSON('http://some-foreign-server.net/ajax-handler.php?param1=foo&param2=bar&callback=?', function(data) { // do stuff } ); Then setup the request handler to prepend the callback parameter to the response and wrap it in […]
Lightbox Clones
The Lightbox Clones Matrix is a list of scripts that do inline popups, ala Lightbox. You can filter by JavaScript frameworks and features.
Preloading Images
UPDATE: Now that all modern browsers (that is, everything except IE8 and older) have support for multiple background images via CSS3, that is my preferred method. It’s detailed by Jeff Starr in his post, Better Image Preloading with CSS3. * * * * I’ve been looking for a good way to preload images for rollovers, […]
Passing Arguments to an Event Handler
Mark Wilton-Jones has a good overview of the most common methods passing arguments to an event handler in JavaScript. This page has a function (addevent2()) that worked for me.
mouseenter, mouseleave Events for non-IE Browsers
Stephen Stchur has written a script to mimic IE’s proprietary mouseenter and mouseleave Javascript events for non-IE browsers. This is useful when you have one element (B) laying on top of another element (A), and you want to do a mouseover/mouseout on A without the mouseout firing when you hover on B. Quirksmode has articles […]