Tagged with style

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 »

No Photoshop Necessary: A Quick Guide to 3D Text Stylin’

No Photoshop Necessary: A Quick Guide to 3D Text Stylin’

As I’m sure you’re already aware, CSS3 is really pretty wonderful. Along with transitions, which can create animations in a tiny fraction of the old code and time, one of the best features is text-shadow.

Some great reasons to use the text-shadow property:

  • Allows us to make pretty headings, hover states and calls-to-action in moments
  • Drastically reduces monotonous work doing Photoshop layer blending, saving for web, uploading, HTML tag editing and cache clearing
  • Best of all, it lets us keep the text dynamic! This is great for those of us who pass on a project to a less technically inclined colleague or client. I know you’d rather it didn’t get passed back to you for each of the twenty pixel-pushing revision requests, and maybe it can even go into the CMS!
Read More »