Recently we’ve completed four sites for Civigroup Companies. Within those sites you’ll notice several instances of sIFR (flash replacement text) inline with content. This is no easy task for sIFR text.

While trying to accomplish this feat of magic, I spent quite a bit of time researching different aspects of sIFR and how it works with CSS to understand how to make this work properly and of course, all while being cross browser compliant! So, in order to perhaps save someone else the time and hassle of trying to figure out the magic equation, I figured I’d share my experience.

Step 1: set the sIFR class on a span tag where you want the text to be.

<span class="h1inline" style="width: 325px;">Heritage. Commitment. Vision.</span>


Notice the width style attribute, this is required to make sure safari does not include extra space behind the span and before the rest of the copy.

Step 2: set the attributes in the sIFR-screen.css sheet to make it an inline block element along with the rest of your styles.

height: 25px;
display: inline-block;
overflow: hidden;

Notice the display: inline-block; this is also a safari required attribute.

Step 3: Tune height if necessary in the sifr-config.js

tuneHeight: '-5'

This will help if you plan no not only having your sIFR text inline, but also a link. I was having difficulties with the underline of the hover state being cut off by the flash doc.

 And viola you have sIFR text inline!

Terralever has recently finished a flash application addition for Couture Book that allows the user to personally design they’re own one off luxurious photo book. The books feature hand-bound stitching as well as a slue of personalized options such as torn page edges and photo framing. These books are a great way to showcase personal photography, special moments in your life, or as family keepsakes.

The flash appilcation we’ve created allows the user to pick cover options, upload photos, select personalized options, review their book and then purchase. The usability of the application makes this so easy anyone could create they’re own personalized photo book. Also, the page display for the review of your book includes turning and shadows to make you feel as if you’re really flipping through your creation, so you know what you’re getting before you buy.

Couture Book and some of the application highlights was recently showcased on Fox 10, check out the video clip. After you see it, go pull those photos out from under the bed or out of the closet and make your very own Couture Book.

Come one, come all to Desert Code Camp! Want to learn more about a new technology or how your peice of the development puzzle fits in with another? Maybe you just want to hang out with a bunch of geeks for two days? 

When: September 15th & 16th

Where: UAT Campus

Classes are filling up now, so sign up on the Desert Code Camp website asap to reserve your seat.

Terralever employees, Scott McAndrew and Casey Rayl, were interviewed on Tuesday by Laura Foy regarding the newly released Zero Gravity game that employs Microsoft’s new rival flash technology, Silverlight.

Over the weekend I stumbled upon this really nifty website whos interface doesn’t require a single click to use. While flash intensive, it’s still pretty revolutionary to take the click out of web design. “Click Here” is the bread and butter of calls to action, but what will drive action when only a hover is needed?

Check it out here, http://www.dontclick.it/.

Pretty freakin cool in my opinion.