Mike Industries

Thanks for all the hard work, Mike and Mark! Installing this new version as we speak - I’m sure it’ll work great…

Any plans for any other future releases? I know you said it’s a final release, but is this the end of the development road for sIFR?

Man, I was totally going to ask if we can call it siffer.

Good work, Mike and Mark! I keep repeating myself, but I have to say that you’re really leading the (r)evolution of type-on-the-web with this thing. I’m glad to — in some way — have been part of it.

Gabriel - I had some similar problems to begin with. Once you get your head around it all, it becomes a lot easier to sort those issues out. Persevere and you’ll make it work :-)

Nice one Mike. Currently being implemented accross a number of our projects where we’ll see real benefits.

One thing though - the name, sIFR. It’s a small issue, but one that’s been bugging me a while now.

1) Why the small “s”? (In fact, why an “s” at all - Flash is inherently scaleable)

2) Why is Mr. Inman more important that the other contributors?

3) Why is it Flash Replacement, when it’s really Text Replacement (with Flash).

4) Do you really pronounce it “siffer”? Eugh.

Bearing that in mind, I’d say Flash Text Replacement (FTR) would be a better choice. It’s pronounced FTR, not “Fitter”. ;o)

Still, it’s the best thing I’ve seen on the Web in YONKS.

sFIR is great… BUT!

When I try it, the text is not replaced, but rather added. I can still se my h3 heading underneath the sFIR-flashfile.

Other than that small hickup, its fine.

Strange thing - if there a multiple headers on a page, only the first one is replaced. Or - like in this example - when h2 and h3 tags share the same swf file, only h2 is replaced.

Oh, sorry. Here’s the link.

Regarding “sIFR”, this has to do with the history of the technique. Originally it was founded by Shaun Inman, then someone called it IFR. The “s” is for “scalable”, because the original IFR version wasn’t.

And as with all things which evolve (I think), you don’t suddenly change the name completely to draw more credit to you.

evil_mad_developer, I suspect you don’t have the right CSS in your page.

Krzysztof, they are replaced just fine. Perhaps you disabled CSS after the replacement to test it? The h1 and h2 have a transparent background, and the font-color is white, so you won’t see them.

An important comment for everyone noticing size differences between Mozilla and IE: you need to specify a with other than auto.

Regarding the origins of the IFR acronym: IFR is just an anagram of FIR, and pays homage to Fahrner Image Replacement. And it’s “Flash Replacement” instead of “Text Replacement” for the same reason, to parallel FIR. The scaleable distinction is important because the original technique is limited to the font-size specified when the swf is exported. sIFR is smart enough to know it’s place and resize accordingly.

Suddenly, everything works fine :)

Right behind you, guys! Doing an ASP.NET adaptation of sIFR.

Mark/Shaun,

Cheers - that explains it all. (except the small “s” - I’ll let that one go)

Jim

:)

Hello. I am the French user of this technique. I am often brought to use the characters “ô ù à é è ç” and others. I noted that these characters are not in the result of flash. How I can change it?

(Editor’s Note: To add extra characters, click the “Character…” button on the Properties palette in Flash before you export your .swf)

I am not home on my mac, so this may be a Windows issues with the zip file again, but I am getting this error when exporting the swf

C:\Documents and Settings\Alexis\Desktop\sIFR 2.0 rc1\customize_me.as: Line 1: ‘;’ expected
/* sIFR (Scalable Inman Flash Replacement) Version 2.0 RC1

Shaun, thanks for the clarification. I didn’t really pay attention to the original IFR…

Maxime, you’ll have to add them to the Flash file. Adding all these characters by default will increase filesize dramatically.

Well its definitely a PC issue with the current zip file. I VNC’d to my G5 and exported the swf from there and did not get the error message I posted above.

And God said, “let there be type!” and there was type and it was good.

Nice work :) Just a small note though. Maybe you already know about it: the uppercase feature doesn’t work for accented characters (like å, ä and ö, which are used a lot in Swedish).

That’s the only problem I have noticed during my very limited testing.

Roger, blame JavaScript for that ;-)

Hi Mike,

Just a quick note to say that I’m still getting the variation in pixel height we found using the previous version, i.e. text in the right-hand column is 2 pixels shorter than the text on the right.

Also, I wonder how well the domain check works with uk domains such as housedoctor.co.uk as the flash file doesn’t seem to work with the domain locked to that.

All the best,

–
Ian

(Editor’s Note: Ah crap, I am only checking for top-level domains… didn’t consider that top-level domains can contain two sections… will try and fix in the release)

Mark: Ah, so that’s where it goes wrong. Well, nobody can expect you guys to write your own toUpperCase() function ;-)

Been lurking upon your work on sIFR since the beginning, but now I just have to come out and take a stand - this is absolutely brilliant!

There’re still some problems, eg. transparency with Opera, but I guess I shouldn’t worry about it too much. It’ll be fixed in a future release (of the browser), right? :)

f opera.

thanks guys for the new release and the instructions. very much appreciated :)

Awesome, awesome work. sIFR will be implemented in a large-scale web project slated to be launching by the end of the month from our agency.

One thing I have found - IE5.2 Mac will not replace unless the replacement functions are in the actual HTML. Putting the replacement code in the .js does not work.

again, this sIFR technique is money, and thanks for all the hard work.

question…. is the “*/” a mistake in the below style?

span.sIFR-alternate {
	visibility: visible !important;
	display: block !important;
	position: static !important;
	left: auto !important;
	top: auto !important;*/
}

(Editor’s Note: Uhhh, yeah, that’s a mistake. I just fixed it. Thanks!)

Is it just me or are there problems with links being sIRF-ized?

I have

sIFR.replaceElement(”h1″, “17thdegree.swf”, “#508DD0″, “#508DD0″, “#508DD0″, null, 20, 0, 20, 0, “textalign=left”, false);

despite this, my link starts blue (#508DD0), then stays blue when moused over, then on the mouse out it turns to black. Then when hovered after that, it turns blue and goes back to black on the mouse out. Am I just missing something here?

Mike,
Did you remove lowercase support in this version? Because I don’t see the option listed in the updated example, and since I’ve replaced the .js file and re-exported the .swf my titles are no longer in lowercase.

If you did remove it, can you bring it back? If not, I can just revert to the old version….

(Editor’s Note: This is fixed now. I uploaded a new RC1 file at 12:45PM Pacific Time on Thursday, October 7th. Please re-download.)

Simply awesome work guys. Thank you from the bottom of my heart. I’ve convinced many of my clients to go the CSS route and now I can offer a beautiful, accessible, indexable alternative.

I’ll be loading it in the morning to take it for a spin. :)

First. Awesome!!!
Thanks a bunch to all involved, possibly the best thing to have happened to the web in ages. Beautiful fonts without having to cut hundreds of headers. Yay!

Minor note, Not sure if its been mentioned before.
I originally installed version 1.1.3. And this worked fine. In fact, better than fine because for some reason, the .swf didnt sit on top of the z-index/stacking order meaning my html menus could sit on top of the flash file. version 2 however works as you would expect and sits top most. Ill keep using 1.1.3 for this reason but thought you might like to know. Hope all that made sense.

Yeah,
Disregard the minor note bit. I’m a spaz.
But still. Thanks!
Pete

Nice one guys! Keep up the good work!

I’ll be updating real soon. Big ups to Mike for the nice use of the word “homies”.

Great work here Mike and Mark. Quick question, any stats on the amount of downloads of sIFR?

Sorry to be a pain, but is this error just me? I thought last time it was becasue you zipped the file on windows. This only happens on my windows box here at work, on my G5 at home there is no problem.

C:\Documents and Settings\Alexis\Desktop\sIFR2.0rc1\sIFR 2.0 rc1\customize_me.as: Line 1: ‘;’ expected


Marty Stake, replacements in the script are cached by sIFR and executed on page load. The JavaScript method needed to do this is not supported nativly by IE/Win 5.0 and IE/Mac 5.x. A workaround is being used for IE 5.0, but - this is pure theory, I don’t have a Mac to test this on - appearantly this workaround isn’t working.

I’ll try to debug this with Mike, as for now you can place the replacements before the body closes or in an external JavaScript file which is loaded before the body closes.

Thanks for all the work so far Mike and Mark

Implemented sIFR on my blog and am about to use it on a fairly large site i’m developing.

Dynamic headlines while still getting greater typographic control - fantastic!

When you say “Possible weirdness in certain versions of Opera.”, do you mean that the Flash text doesn’t appear sometimes when you load the page, until you refresh the page? Because that’s what I’m getting on jukebo.cx — in IE it’s all working fine, but Opera (version 7.54, on Windows) is having occasional problems…

I was to implemet this into my blow but noticed when I run this on WinXP with SP2 and IE 6 that I get a security warning. First a yellow bar at the top of the window. If I click it and choose “Allow .. content” i get a popup with the text

Allowing active content such as script and Active X… may harm your computer.. are you sure run active content.

Is this just me because I have not seen any comments about it.

@Paul: I’m having a similar problem in Opera 7.54 on Win XP SP2. Example: on http://www.mikeindustries.com/blog/files/sifr/2.0/ the big centered headline “the gothic times” doesn’t get rendered at all and there is no h1, too. When you hit reload the page scrolls a bit down (it gets longer) and there is a big white gap where the headline should be.

Besides this problems: it’s a brilliant piece of work and on behalf of millions of web designers I say: THANK YOU!!!

Greetz from Germany

Marty Stake, I was wrong. There were no onload events firing for IE/Mac! It’s fine now, but you’ll have to wait for the next release (while we wait for more bugs).

(Editor’s Note: This is fixed now. I uploaded a new RC1 file at 12:45PM Pacific Time on Thursday, October 7th. Please re-download.)

@Christoph: I don’t have the same problem on the sample page — the headline appears fine for me. In fact I’ve only noticed this problem appearing on jukebo.cx, which I’ve developed, so I did wonder if there was just something wrong with my implementation. However, it works fine in IE. Not that that really means anything, of course.

Having a small problem with the height of the flash text. I am trying to place a border on the bottom only but end up with a massive gap. I have changed the setting to no avail. I have set the margins and padding to 0 on all elements to test but that makes no difference. Any ideas??

I’m experiencing the same problem James mentioned (#29), with incorrect color on rollout. I created this sample using the files included with the sIFR 2.0 RC1 download, and simply changing the text and link colors assigned to the h1 replacement.

When you load the page, the headline is correctly displayed in #6298C1. When you rollover the headline, it is correctly changed to #999999. When you rollout of the headline, the text color incorrectly changes to #000000, instead of reverting to #6298C1.

Mike’s response did not seem to properly address this problem. It seems there was a misunderstanding. I apologize if in fact I am incorrect.

Thanks for everything, Mike et al.

(Editor’s Note: Thanks… this was a regression bug. It was important enough to cause me to update RC1 and fix it. I updated the file at 12:45PM Pacific Time on Thursday, October 7th. All should be fixed now.)

The fix works. Now it’s not just money, it’s cash money.

Great work and thanks to everyone involved.

First off, sIFR is beautiful and I commend all of your hard work.

I’m using it in a soon to be released mini web app (MacForce Bundles) and am running into some issues in a few browsers.

• IE Mac is buggily displaying all of my [h2 class=”bundle”]’s especially on the details page. The huge green block is just an [h2] between [td]s and looks fine in all other browsers.
• In IE6 PC, the selected tags are not being replaced with flash, and are still left invisible.

Thanks times ten.

Javan, If sIFR in IE5 Mac is giving you trouble (which in more complex sites it seems to), you can use this.

.sIFR-hasFlash h2.bundle {
visibility: hidden;
/*\*//*/
visibility: visible;
/**/
margin:0;
}

Basically it will still show the h2 html in IEMac, all other browsers will hide the h2 html and replace with sIFR.

Thank you muchly for all your hard work and effort in getting decent fonts onto the web, without resorting to browser or platform specific typeface rendering.

With the release of this RC, all I can say is: bring on the eye candy!

Just a short comment: Creating individual .swf files based on sifr.fla did not work for me (Win2k, Flash MX) - never got any text in the swf. But I found out, that the first blank line in dont_customize_me.as and customize_me.as lead to a syntax error. Removed the blank line and everything just works fine. Big thanks for sIFR!

Is anyone else having trouble getting sIFR to work on a textpattern site?

This is pretty bad ass… I works for me

I haven’t seen anything mentioned about this, so I’ll see if anyone here has run into it. I’m only able to create the dynamic swf from Dreamweaver MX 2004. I can not get a file correctly processed from Dreamweaver MX. I am using the version of the files just downloaded. Another developer and I are on MSN and he’s having the same problems. (I’m on a MAC, he’s on a PC)

Is this a known issue?

I’ve got it showing up on Firefox, but it won’t show on IE. Any ideas what I’m missing?

click

Thanks!

cjs, I’m quite confident that this has something to do with the placement of the script tag which loads sIFR. Put it in the head, not in a table.

Peter, sIFR works on the client side. Whether you’re using TextPattern or not does not affect sIFR (unless something funky is going on with regards to the stylesheet… but without a demo I can’t verify that).

Thanks Mark, I tried putting it in the head of the page instead of the header include file but I’m still not seeing it in IE…

cjs, then it might be a CSS problem. No offence, but the source is a real mess, which doesn’t help matters.

I sent e-mail to Mike about this a while back, but I started to feel like I was nagging, so I dropped the issue. However, my “gripe”, if you could call it that, still stands.

With Flash MX 2004, there’s a feature to keep text aliased. I used a pixel font with the sifr.fla and selected the option to keep the text aliased. I set the JavaScript to require the client to use Flash 7. However, when I view the page in any browser, the text just disappears. Other replaced text shows up just fine, but not the pixel ones. The box, though, is there, because I can select it, even though it’s blank. Weird.

Any ideas?

Mark, no offense taken, I didn’t build the app. I appreciate the help, I’ll post if I find an answer. Thanks.

Hey Lars, what program did you take the lines out with? I have tried modifying these files in Dreamweaver and NotePad but Flash MX/WinXP still gives me these errors. Not a big deal since I am doing most of my work on a mac but I would like to be able to play around with the files here at work.

alexis, notepad nor any other windows editor where of little help to me, too. but then i ftped the files to a UNIX server, opened them in vi (unix editor) and - voila - there seemed to be a MAC character at the start of the first line. after deleted it the sIFR.fla worked just fine!

it should read “after i deleted it” at the end of that entry above *g*

Thanks Claus, I used pico on my mac to remove the characters and now all is well.

I am having trouble creating/exporting the swf file using Flash MX (not MX2004) in version 2.0.

I’m following Mike’s directions, loading the sifr.fla, double clicking the text box, choosing a new font, then exporting the movie to FlashPlayer 6. But after entering my new font in the JS replacement section, nothing is loading in my browser. Double-clicking the swf file just reveals a blank, not the text: “Please pass in your text” as in the examples tradegothic.swf and vandenkeere.swf.

Does this only work with MX2004? Any ideas?

I may be overlooking something real obvious in the documentation but…can someone point me to some information on controlling leading and extra white-space within the replacment div’s?

The heading replaced here has an inordinate amount of white space at the bottom of the text I can not, for the life of me, seem to get rid of. Do I need to use negative margins or some other tweak, or am I overlooking something from a previous post?

Any insight greatly appreciated!

Following up on my earlier question regarding my inability to create a swf file, here is the output message I’m receiving :

\\path-to-my-file\sIFR\customize_me.as: Line 1: ‘;’ expected


I have re-downloaded the zip file; the example works flawlessly. The action script includes do not appear to be working correctly in creating a .swf from the .fla file.

Any suggestions would be much appreciated!

I’m really looking forward to getting this bad boy out on the highway. Kudos for the hard work.

However, I’m getting the same error as above. I tried editing in vi as Lars and Alexis did, and the first time I saw ^M all over the place in dontcustomize . .then I reupped and the character was gone. Just to be safe I saved in vi and then pulled them back down off the server. Still get the above error no matter what I try.

What is the maximum font-size? I’m getting a ceiling of about 125px. Is there a way to increase this limit?

Just sort of pushing the limits and seeing what’s possible.

Thanks for the work.

Great job, the only things who is missing for accessibility is the proportional font resizability, for exemple see
here

Trying to implement the SIFR at Milkround.com, and the flash means the drop down links are no longer clickable. It is the h2 tags that I am replacing…

Any resolution to this yet?

Umm, kinda n00b here so i’m gonna ask a dumb question.

Can I use a certain font-face even though the user doesn’t have it installed in their com?

Forgive me for such a dumb question, i’m really new here. Good job to Mike!

Ben, most likely you have to set the background of the flash to transparent.
So something like this:

sIFR.replaceElement(”h4.classname”, “/sIFR.swf”, “#171A23″, null, null, “transparent”, 0, 0, 0, 0);

Alexis,

I appreciate the respone and you were correct. however even when specifying a background, it still obscures the menu and makes the sub-links, (in the dropdown) unusable.

(Furthermore, with a dark blue background, it goes through the menu and looks worse!)

Code used:
sIFR.replaceElement(”h2″, “/s4/jobseekers/_sifr/fonts/lucidahandwriting.swf”, “#FFFFFF”, null, null, “#1C387C”, 8, 0, 8, 30);

If your url string is particularly long, flash cuts it off. Is there a simple way to fix this or do I need to dig into the code? The url im trying to pass it is: http://cobrand.lawinfo.com/common/faqandforms/dsp_coresults.cfm?cat=106&state=&act=form&site=univision&cbID=120&i=b&cbURL=univisionabogados.lawinfo.com

I know its long, but its valid html for all I can tell. Thanks.

Quick question: is there a way to change the default padding of the Flash result? I’m trying to put borders on the text, very close on the bottom. Unfortunately I’ve been unable to make it work; it seems like the Flash wants to put at least 5 pixels of dead space below it. I have the padding everywhere set to 0, I set new style rules to change the margins/padding, nothing seems to change this basic fact. I also went and changed the Line Height from 2pt to 0pt in the Flash itself; again, no change.

This is a tiny thing, but a very frustrating one. I can upload the files of what I’m working on if needed.

Thanks!

Ben, if you use a background color it will certainly not work. What happens when you use the following? I would change the bg color with a div background color which contains the h2 tag.

sIFR.replaceElement(”h2″, “/s4/jobseekers/_sifr/fonts/lucidahandwriting.swf”, “#FFFFFF”, null, null, “transparent”, 8, 0, 8, 30);

This page I made uses an older version of siFR but it has suckerfish drop downs which work just fine.

http://www.rhinopallet.com/products.asp

The version above uses siFR version 1. I manually changed the wmode to transparent. Some one may have to correct me but I think version 2 sets wmode to transparent when you use the following syntax .

sIFR.replaceElement(”h2″, “/s4/jobseekers/_sifr/fonts/lucidahandwriting.swf”, “#FFFFFF”, null, null, “transparent”, 8, 0, 8, 30);

Any chance we could get this to work with the vertical bar “|” character? Otherwise, this is really great stuff!

Like everyone…nice job!

I was wondering if there was a way to adjust the kerning of the characters? I have a heading of 14px all caps and would like to space it out a bit. I’ve played around with everything and still it goes back to the same spacing. Any help appreciated. :)

I just began implementing this today. All is well in mt Firefox1 test, but the Flash replacements do not show in IE6.

Could someone point me toward my mistake?

Hi,

Thanks for all your hard work on this it really works well and certainly opens a lot of new design avenues. I do a have one problem though and forgive me if it is caused by my inexperience with CSS.

Can you confirm that sIFR does not work when applied to an html list containing links?

I want to use sIFR for a navigation menu displayed as an inline list (my CMS outputs menu links as a list). The ‘menu’ is displayed in FLash but loses any font size control applied to it (it goes really big) and loses any spacing between the words and operates as a single link.

e.g. “link1link2link3link4″

You can see what I mean here: http://ssd23.digital-word.com/folders/services/services/

CSS here:
http://ssd23.digital-word.com/assets/templates/default.css

I really appreciate any light you can shed on this.

Thanks.

Adam

Adam, you are replacing the whole menu with one Flash element. No wonder things break down…

You can use normal CSS selectors in sIFR. So, instead of “h4″ you use “div#horizontalNav li”.

Randy: curiously enough, I was having the same kind of problems today. Neither my WXP/SP2 IE6 nor my friend’s W2k IE6 were to display anything. Also, when I try to view the sample demonstrated above, well - it just doesn’t work. I have Flash properly installed, Opera and Firefox work well, and I did allow the Javascript to be run when asked.

If I’m not entirely mistaken, this could point a possible flaw in the code. Anyone else experiencing the same?

Mark,

Thank you so much for that. I am very new to CSS and you just saved me a lot of head scratching. I can now say I am truly in love with sIFR!

You are a scholar and a gentleman , sir!

Cheers,

Adam

This is so great I’m in awe of your dedication.

I just thought that I’d mention in case anyone is using “line-height” in their CSS file with sIFR that the sizes will be distorted on different platforms and didn’t show up on my Win IE. This was specific to the actual item being replaced by sIFR and not the other elements on my page/CSS.

Anyone else experience this?

Mike S, this has to do with the dimensions of the element as calculated by the browser. Nothing we can do about it, alas…

I having the same problem that a few other folks have mentioned, but no one has responded to yet. (see comments 46, 67, and 77) I’m getting the white space at the bottom of the movie. The solution seems to lie within the use of the the “.sIFR-hasFlash h1″ properties but I can’t seem to make it work like I want. Anyone have any tips or tricks they have discovered? I’m trying to use Interstate BlackCompressed.

I was just looking at this for the first time ever, and what a nice piece of work it is!

I might have some technology to share.

Would you guys be interested in experimenting with dynamically resizing SWF’s within a page? I have been experimenting with it in the past and have found a quite compatible way of pulling it off.

It would allow you to get resizing blocks of Flash text, although it wouldn’t allow for you to put some inline blocks in the resizing text, like you have in your example, unless you’d find another workaround for that.

Thanks for the great work people!

This is very cool. One question: will google find text that’s been replaced using sIFR? I’m guessing the answer is no, but I could be wrong. If the answer is no, is there any way around this problem?

another question, probably a dumb one:

what’s the advantage of sIFR over dynamically generating header images using PHP?

You know, I’ve been playing with this since its inception and must say you people are to be commended. This is simply an astounding evolution for web designers, and your work will undoubtedly be utilized by thousands.

Congratulations, and thank you.

Two recurring issues, and corresponding band-aids:

1) Issue: The line-height issues is also unbearable for me since I use that attribute quite often.
1) Band-aid: My only solution has been to eliminate line-height, knowing that the Flash version will be viewed by the majority. Sigh.
2) Issue: Jason writes “…(see comments 46, 67, and 77) I’m getting the white space at the bottom of the movie.”
2) Band-aid: I was able to alleviate this issue on my first implementation using a negative “letter-spacing” attribute in the “.sIFR-hasFlash” Styles. This is illogical and I can’t explain why it worked, but it did. So I’m accepting it and moving on.

Again, you people rock. This is a revolutionary technique.

Cheers!

Hello great work and I adore it, but somebody just contacted me to tell me he is confronted with the placeholder for flash instead of the plain text.

Url: http://www.templaterie.de/showroom01/index.php?c=1&s=schmucktext
(It’s a German page realized with Editland 1.0, a miniCMS on PHP.)

My visitor used MS IE6. I could ask him whether he had or has a previous Flashversion or Flash installed/active at all.

Thank for your help, anyway.

Yours
Silke

@T

That’s quite easy: Copy&Paste resultes in a textcopy and not an image.

By the way I’am a flashdummie and very far from a JS-Expert … would it be possible to rotate the line slightly by feeding the degree. On my sample I immitated a post-it and to have the text rotated by 10-20° would just top the impression.

Kind regards from Backnang (Germany near Stuttgart)
Silke Schümann

Allright … your page looks the same to him.

It is “javascript im ie (java sun)”, he thinks.

I hope you can solve that one.

It doesn’t realy make sense to have keywords and header replaced by turkish puzzlepiece-shapes placeholders. :o)

Yours Silke

@T

Oh, another easy question:
Google will just fine find, read and index the text, as you write a plain XHTML-File and formatting this via CSS an JS. Google doesn’t run JS-functions. ;o) Which is actually another advantage towards images generated by php.

T, as Silke wrote, the replacement is done on the client side in a browser. Search engine spiders don’t run client side code. Another advantage of this solution, besides the one Silke pointed out, is that there only has to be one Flash file downloaded for each font, so it should save in bandwidth.

Mark Wyner, you can set some specific CSS for to-be-replaced elements using html.sIFR-hasFlash. The letter-spacing issue is weird, but I assume Mike can put that in the documentation?

Peter Dekker, thanks for the offer. sIFR indeed has issues concerning resizing the Flash objects when the text is resized or if the window itself is resized. Unfortunately there is no nice way to detect a text resize: no event is fired on a text resizet. A workaround might be to check the height of a certain element (body tag?) every second, but that would involve an interval and would be very unreliable.

Also, I don’t think it’s that dramatic if sIFR doesn’t follow text resizes, as it should be used for headers and not body text. As for window resizes, I think that’s even less of a problem.

So, to conclude, I don’t think the code necessary to resize the Flash objects is worth the trouble.

Silke, I don’t have trouble with the site in my version of IE (6.0.2800.1106). As for the titled line, go ahead and hack the Flash file ;-)

@ Mark

Well, nor have I. I wonder what blooming configuration it takes to get this and how often it occurs. At the moment I ask my visitors to let me know and hopefully it is a rare exception. Though I’d rather wish there wasn’t any exception at all.

Thanks for pointing out bandwidth, I hadn’t thought of it yet.

Because of Silke’s post on a different forum I am now able to play around with this great piece of software. I did something similar before, but I just concentrated on the replacement of standard pictures with flash-elements. I took a totally different approach, mostly using PHP to do handle the replacement. Your realization is way better. Your concept is great and the resulting software is something I will enjoy using.

So, thank you all ! GREAT WORK !

Is there anyway to take one “font.swf”, and be able to maniuplate it to display all large caps on the first character of each word, and display smaller caps on the characters following the first?

Example:
BLAH STATE UNIVERSITY

I tried intertwining hx tags but I don’t think that is legal xhtml nor did it work.

Theoretically here is what I’m thinking…
<h1><span class="large">B</span>LAH
<span class="large">S</span>TATE
<spanclass="large">U</span>NIVERSITY
</h1>

I applied styles, and could not get it to work, any suggestions?

Has anyone found a way to float an image (or anything else) next to a sIFR element? I’m not able to do it… I tried the typical way of putting the image right inside the opening tag of the heading element… Instead of floating, the text appeared beneath the image. I also tried placing the image before the heading element as well as after the first couple words, just for a kick. That didn’t work either.

Is this not possible due to the Flash portion? I have floated Flash elements before… and if I disable JS, I can float the image next to the CSS styled text. I’m about to give up here tonight… just thought I’d ask if there was a way I hadn’t thought of.

I’m not sure if there is a more appropriate forum to post these little funky things in… please point me to the right place if there is. :) Meanwhile, I ran into something strange. Not sure if it’s a bug or just “how this works”… but thought it was worth mentioning.

If I use sIFR for a heading, but don’t want to use it for all headings, the ones I do NOT use it for, are removed, just as if I were replacing them. Only, since I want to use CSS instead of Flash, nothing is there to replace it. In the case of an H2 selector I wanted to style with CSS, I’ve removed the .sIFR-hasFlash h2 selector as well as the sIFR.replaceElement(”h2″,… in the javascript at the bottom of the page. Is there something more I need to do? Or is this a replace all headings or no headings issue?

I put an example up because I had to make a minimum test case to figure out why in the world my text was disappearing. :)
Here is the min-test with the main text area in a P element-
http://www.kpcinc.com/philosophy/testerP.htm (that’s basically how it should look)

Here is the min-test with the main area as an H2 element-
http://www.kpcinc.com/philosophy/testerH2.htm (it should look just like the one above…. and if you disable javascript in your browser, it does.)

And on the floating issue I mentioned in the number 103 post, I’ve made a test case to show that as well. I mispoke above — the image disappears if I place first within the replaced H2 element. It shows, but the H2 element shifts down if I put it right before the H2.
http://www.kpcinc.com/philosophy/tester.htm

Thanks for any info or ideas… you can email me at stephanie@communitymx.com if needed.

As far as I watch the behaviour of the replacement, it analyses its space first and then takes it as a small block. It takes all away what is in the >-tag provided for replacement. Thus it doesn’t make sense to put images within the >-tag.

As the block with flash appears as such it will only stay next to an object and not float around. Only if there is a parameter to tell flash to regard objects that take part of the same space and move a little it will work. You have to look for a function within in flash not CSS.

H2 replacement
If you tell your CSS take all out, it will take all out. If there are exceptions (class / ID) you have to tell your CSS not to take it out.

…
I wish I knew more about flash. :o)

@Ben Lumpkin
this question was answered in the kick-off-thread. You have to choose a font with caps to solve this problem.

The ‘Why’ you can read in my post 105.