Comments

Using sIFR in an elastic template. :: Oct 4, 10:35 AM

Having spent the end of last week researching views on sIFR and its possible issues I came to the conclusion that for headlines and non linking text the techniques is applicable in this situation. In this case the use of sIFR is to include the brands font further instilling the brand throughout the site.

The one issue requiring attention when using iSFR in an elastic template was the problem of resizing the replaced text if the user increases their font size during the time they spend on the page. The template would break under some circumstances causing content to become hidden under the replaced text.

This has been overcome with a JavaScript that uses setInterval and offsetWidth checking the width of the containing div every second. If a change in the width is detected the do_sIFR(); function which is included in the sIFR addons JavaScript is used.

Initially I had written a script to detect the font size itself however this did not work in IE6 as the font size is set in % and therefore did not seem to record a change in size via the DOM getComputedStyle call.