Tagged with webdesign

Better jQuery Tabs Plugin

Better jQuery Tabs Plugin

Delicious, light and sugar-free!

This is a tight little jQuery tabs plugin that will activate and prevent scroll on load when there’s a URL hash, or do nothing if the hash isn’t one the tabs. It’ll also check if there are links to other tabs in the content. It’s got object literal organization and a little fun progressive enhancement.

Once again, I found a standard-use script lacking magic, and this time it was my group’s go-to tabs plugin. It used a standard flavor of JS without leveraging any library, and it was bad. Switching between tabs took about a second, and even more was added to page load.

By using jQuery, we can cut that to a tiny fraction, while still keeping all the same functionality. Read More »

CSS Transition Tricks: Fading Images on the Road to Success

CSS3 Transitions are fun stuff! With only a couple dozen characters, it’s possible to create beautiful interactions with dynamic pseudo-classes, which once was relegated entirely to Flash or dozens of lines of JS.

Of course there are some problems, though. One must take into account all the idiosyncrasies of the myriad browser engines, and include their  vendor prefixes. The older, crappier browsers don’t support them at all, and if you’re expected to mimic the functionality in IE6, your are in for a very long, annoying day.

Benefits and speed bumps aside, it can be difficult sometimes to get exactly the transition you want. For example, when you’d like to transition one background image to another with a fade. Read More »