Posts Tagged ‘downloads’

5 Asset Management Tricks for Faster Websites

5 Asset Management Tricks for Faster Websites

When it comes to front-end performance, good asset management is just as important as good code. Simply put: downloading assets takes time.

Computers and browsers now render pages and execute Javascript faster than ever. Although user bandwidth is increasing, the filesize of assets has been growing in turn.

These factors, combined with the rise of the mobile web, have made bandwidth the primary bottleneck in website performance.

Here are 5 simple steps to reduce download times with better asset management on your sites. Read more…


jQuery Contra Plugin – Up, up, down, down, left, right, left, right, B, A, enter

jQuery Contra Plugin – Up, up, down, down, left, right, left, right, B, A, enter

Remember the code from Contra on original Nintendo? Up, up, down, down, left, right, left, right, B, A, start; it’s also known as the Konami Code and the 30 Lives Code.

This famous sequence of buttons from the 80’s isn’t going anywhere: in more recent times it’s been in a Moldy Peaches song, and used as an easter egg in Google Reader and Facebook, to name a few.

But I’m sure tons of great things can still be done with the code from Contra, so I built it into a simple jQuery plugin that can be easily used on any site.

The jQuery Contra Plugin allows you to call a function of your choice whenever a user enters the Konami Code (up, up, down, down, left, right, left, right, b, a, enter).

Download the Contra Plugin

Read the jQuery Contra docs

How to use … Read more…


TranslateThis – A Javascript Translation Widget for Noobs and Nerds Alike

TranslateThis – A Javascript Translation Widget for Noobs and Nerds Alike

TranslateThis is a new Javascript widget that provides 52 languages of translation by leveraging the Google Language API.

Installing TranslateThis couldn’t be easier—simply copy and paste the widget code anywhere on your website, you don’t have to upload any files or change any settings.

Besides being easy to use, TranslateThis also provides many attractive features for developers. First off, requests to the Language API run in Javascript, so the translation is pretty fast. Additionally, the script is lightweight, weighing in at just over 11kb with another 7kb of imagery. And since it doesn’t depend on any Javascript library, TranslateThis can be implemented on any website without additional overhead. Finally, TranslateThis has been tested in all modern browsers and its user interface is designed to be straightforward and seamless.

What can you customize in TranslateThis?


YouTubin’ Plugin for jQuery

YouTubin’ Plugin for jQuery

YouTubin’ is a jQuery plugin that makes embedding YouTube videos clean, easy and unobtrusive. In its simplest form, YouTubin’ grabs any links that point to a YouTube page and replaces them with an embedded video. To do so, YouTubin’ leverages SwfObject 2 if available, but otherwise just embeds the video through standard markup.

Advanced options include flagging specific video elements using a jQuery selector and setting a variety of swf properties such as dimensions, flash version, flashvars and params. Youtubin’ can even be used to cause the video to embed once a link is clicked rather than when the page loads.

Download YouTubin’ jQuery Plugin


Scrolling Parallax: A jQuery Plugin

Scrolling Parallax: A jQuery Plugin

Scrolling Parallax is a new jQuery plugin that binds a parallax effect to the scrollbars and mouse wheel. This allows a background image or anything else to scroll at a different pace than the web page when a user scrolls around. The parallax effect that results is an easy way to create an illusion of depth on your website.

Basic use of the Scrolling Parallax plugin is extremely easy. Simply pass the path to an image, and the plugin takes the image and stretches it to the window width and 150% of the height. The extra 50% of the height is scrolled down along with the document, smoothly reaching the end at the same time as the page.

The Scrolling Parallax plugin is also very versatile. There are a wide variety of options including scrolling faster, slower, looping and reversing the animation and tiling the … Read more…


Flipbook Movies with jQuery

Flipbook plugin for jQuery

Flipbook is a jQuery plugin that produces a movie effect by running images in quick succession. The concept is similar to something I always did in middle school: doodling in the margins of my notebooks to make short movies. Times have changed and nowadays I use a Javascript object, pulling the images dynamically with jQuery’s AJAX function and a PHP script ;). But don’t worry, it’s just as easy to use as a real flipbook.

The jQuery Flipbook Plugin is built around my jQuery slideshow tutorial. It’s very flexible, providing great options for both new and seasoned developers alike. You can easily make anything from a short film to an image slideshow to a text viewer.


Translate-It: Easy Translation for Multiple Languages

Translate-It translation plugin

Translate-It is a free tool that makes multi-language translation easy to implement on any website. With just a few lines of Javascript you can quickly include up to 34 languages of internationalization on your site.

Download Translate-It.

The web is a global community with rapidly growing international markets. Translation allows sites to reach broader audiences, and tools like Google Translate and Yahoo’s Babelfish have made the web more accessible. While accessing these translation tools is often too cumbersome for your site’s visitors, leveraging these tools is relatively simple for developers.

(more…)


QuickFlip jQuery Plugin

Quickflip Plugin for jQuery

QuickFlip is a jQuery plugin I wrote that uses a CSS trick to cause a div, paragraph or any other piece of HTML markup to flip like a card. With a result similar to the UI animation on the iPhone, this jQuery plugin is easily integrated into your webpage to make any portion appear to flip and show its back.

When a flip occurs, the front panel is split in half with Javascript. The right and left halves slide into one another, and afterwards the opposite occurs with the back panel. While it's not as smooth as some Flash animation, it all happens so quickly that it really looks like the panel is flipping over (more…)


Lower Case Months Plugin for WordPress

Wordpress plugin

This WP plugin is kind of pointless, since you can modify text capitalization via the CSS text-transform property: lowercase, capitalize and uppercase are all options. more info

While doing some WordPress customization recently, I ran into a problem forcing lower case output for the month headers in my blog archives.

It seems like a simple task but it turns out the WordPress templating engine prevents you from returning any strings from functions while within a template. You can use all the PHP you want, and call any function you want, but the functions in the end work by echo’ing out a result, rather than returning it. This seems like a pretty good security move, but it turns out to be pretty annoying when you’re used to object oriented code and you want to do something simple like make an … Read more…