Not Your Vanilla IFR

Clever clogs, Rob Cameron and Tom Werner introduce a new flavor of IFR, Werner and Cameron Flash Replacement (or WAC-FR), that aims to solve two major shortcomings, the single-line limit and the inability to resize the replaced text. They also introduce the ability to control the typeface, size and color from an external CSS file (requires the Flash 7 plug-in whereas traditional IFR requires Flash 6 or Flash 5 if a query string is used instead of the flashVars property).

While definitely a step in the right direction there are a few issues to note:

  • the use of a relative unit which allows for resizing—pure genius—unfortunately eliminates the possibility of using pixel type or background graphics in the Flash movie which must align to external elements (which may not be an issue for some but I like to know exactly where my pixels are)
  • the current line-wrap function relies on estimated line width which means that occasionally some type will be masked by the proportions of the Flash movie
  • the wmode="transparent" attribute that allows the replaced text to resize seamlessly over a detailed background seriously degrades Flash’s anti-aliasing abilities (this is more a problem with the Flash plug-in than the technique itself but that doesn’t negate the issue)

Regardless, nice work guys.

Previous
First Ever Whitespace Awards
Next
How to Super Mario Bros.
Author
Shaun Inman
Posted
June 22nd, 2004 at 1:03 am
Categories
CSS
Flash
Inman Flash Replacement
JavaScript
Web
Comments
007 (Now closed)

007 Comments

001

Thanks for the kind words Shaun! If we have seen farther than others it is only because we stood on the shoulders of giants. :) You are The Man!

Author
Rob Cameron
Posted
Jun 22nd, 2004 7:14 am
002

Nice. I personally implemented the transparent window mode myself and avoid the whole multiple line issue by, well, keeping my headlines short. Still it’s definitely a good thing to have more options.

One problem I’m still stuck on though is using flash replacement in conjunction with a print style sheet. My print sheet specifies a font for the headers, but the flash generated text gets printed instead. And my flash bg isn’t white, so it looks weird on paper. Any chance of a fix for this in js or something?

Author
Brian Estrada
Posted
Jun 22nd, 2004 6:38 pm
003

Hi, first time commenter here.

I’ve tried IFR, it works flawlessly. It’s also great to see how the community is picking it up so quickly, and in the case of Werner and Cameron improving upon it.

As for wmode=transparent — back in the days, this used to be an Internet Explorer only feature (which by the way slowed down rendering/framerate quite a bit). Does this work in Moz/Safari now?

Author
Joen
Posted
Jun 23rd, 2004 1:38 pm
004

I had problems when I tried to test this in IE4. Is there any way to hide this kind of thing from IE4, so that it only displays unstyled content?

Also there is a file size jump in the swf from 14k to 66k from the original IFR to WAC-FR, is this much of an issue?

Author
FAZE
Posted
Jun 23rd, 2004 7:17 pm
005

I just realised the size jump is probably due to the 2 or 3 fonts embedded in the example, so ignore that last comment.

Author
FAZE
Posted
Jun 23rd, 2004 7:22 pm
006

Hi all, like Joen, first post.

And Joen, wmode=transparent WORKS in mozilla/opera, as you can see in miguelespi.com/sak/version1/default.php.

But, i modified Shaun code to make object style flash tags without embed tag.

you can see the code in miguelespi.com/sak/version1/includes/script.js

And of course, congrats to Shaun. Nice and incredible work.

Author
miguel espi
Posted
Jul 5th, 2004 12:59 am
007

I’ve tried this on my website. It doesn’t seem to work with TDs.

What should I do?

Author
Matthew Robertson
Posted
Nov 30th, 2004 9:37 pm