Call Honest Code at (619) 800-0116

Tag: jQuery

Related Work

Bex Brands

We’ve worked with Bex Brands before — most notably on sites for Vida Pilates, Robin Borrelli and her cabinetmaker husband Michael — but they finally found some time in their busy schedule to work on their own website. Read More

 

Purple Cloud

Purple Cloud is a unique communications platform that connects prospective customers with salespeople at their nearest and most convenient retailer. With chat, video, audio, and photo sharing, Purple Cloud smooths out the sales process, making someone ready to buy the minute they step in the store. Read More

 

Sync.com

Cloud storage services anymore are a dime-a-dozen. What most people don’t know is that they’re letting these services — and their employees — read their most sensitive documents whether they care or not. Sync.com’ value proposition takes individual privacy to heart — even they don’t know what’s on their server. Read More

 


Reichel-Pugh

Reichel-Pugh builds performance yachts — and not just any old performance yachts, either — they build nothing but award-winners, including several America’s Cups. Read More

 

Luce et Studio

This nationally-recognized architecture and design firm needed to replace their aging Flash site with something visually exciting, simple to maintain, and compatible with a wide variety of mobile devices. Honest Code built a WordPress theme to not only serve as a portfolio of work, but also included a unique navigation scheme.

 

PadEdit

PadEdit is an iPad-optimized, browser-based IDE that lives on your web server. Just upload the folder, set a password, and you’re good to go.

PadEdit is also available on GitHub.

 


The Sofia Hotel

The Sofia Hotel is a smart, urban, tech-friendly boutique hotel that wanted to offer its guests more than just a website. The hotel’s mobile site is a tour guide, a concierge, and reservations desk all in the palm of your hand.

 

Ten Stories

For this top-of-the-line video production agency, Honest Code created an easy way for them to showcase their video projects. Using WordPress, jQuery, and Thickbox, adding and sharing new projects is a breeze.
Read More

 

Dinner Studio

Using state-of-the-art jQuery and PHP, Honest Code built a custom shopping cart for this local retailer that makes dinners for families too busy to cook for themselves. Read More

 


FatPencil Logbook

There are plenty of online logbooks for pilots, but FatPencil wanted one designed specifically with the user in mind. With formatting designed to fit the screen of your web browser — and your iPad — this logbook solution is tailor-made for the pilot on the go. Built with PHP and jQuery. Read More

 


Related Blog Posts

Case Study: Dinner Studio

Imagine if you didn’t have to cook dinner every night. You wouldn’t be eating out — that would be much too expensive — but just imagine if the ingredients were already prepared, and you just had to heat a few things up to make a home-cooked dinner for you and your family. No shopping, no chopping. Magic, right?

This magic is the product and service of Dinner Studio, a unique, local business that delivers inexpensive, fresh (or frozen, your choice) meals right to your door, ready to cook for dinner tonight. TV dinners in plastic trays these are not — homemade, family-friendly recipes from Gloria Otten, once a well-known executive chef, fill out a long menu that changes every month. Read More …


Using jQuery to animate a series of thumbnails

For a project, the client had a page with lots of thumbnails, and wanted them to cascade in gracefully, but quickly. Using jQuery, I could have used a callback function at the end of each animation to move onto the next one. However, with a large (and potentially unknown) number of objects, the difficulty of doing this ranges from impractical to impossible.

I could have also queued the animation so each thumbnail appeared serially, but this took too long. (A 300ms animation repeated 40 times gets very tedious.) Instead, I wanted a way to start a 300ms fade-in animation, and start the next thumbnail animating after only 50ms. I did using the setInterval function:

boxes = $("div.box");
var z = 0;
var refreshId = setInterval(function() {
	 boxes.eq(z).animate({ opacity:1 },300);
	 z++;
	 if (z > boxes.length) {
	 	clearInterval(refreshId);
	 }
}, 50);

This works with an unknown number of thumbnails, and stops iterating after the last thumbnail is done animating. In this example, I’m only manipulating the opacity style argument. (That is to say, making this work with IE is an exercise left for the reader.) However, using another method — like .show(), for example — is easily doable too.

You can view a demo here.


 

© 2019 Honest Code, LLC. We love you. Powered by WordPress.
Privacy Policy. Terms of Service.