Book Sale! Save 20% on WordPress books with discount code: SAVE20
Web Dev + WordPress + Security
eBook: WordPress Themes In Depth
WP Themes In Depth: Deep dive into WP theme development.
Related Posts

sIFR Notes Plus

Here are a few sIFR Notes for Perishable Press. Just what are we looking at here? Well, first it is important to understand the sIFR variables and the order in which they should appear:

(sSelector, sFlashSrc, sColor, sLinkColor, sHoverColor, sBgColor, nPaddingTop, nPaddingRight, nPaddingBottom, nPaddingLeft, sFlashVars, sCase, sWmode)

The variable, sFlashVars consists of the following sub-variables (these should be seperated with an & sign:

# Align Flash text block
textalign=center

# Moves text any number of pixels to the right
offsetLeft=3

# Moves text any number of pixels down
offsetTop=3

# Adds underline links when hovered
underline=true

Then, inducing from the following code example, we should place a similar set of statements at the bottom of any pages requiring sIFR functionality:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement("h1", "http://domain.com/path/to/fonts/font1.swf", "#E1E1E1", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");

   sIFR.replaceElement("h2", "http://domain.com/path/to/fonts/font2.swf", "#CC6633", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");

   sIFR.replaceElement("h3", "http://domain.com/path/to/fonts/font3.swf", "#E1E1E1", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");
}

//--><!]]>
</script>

Arguments may also be stated by name rather than sequentially:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement("h1", named({sFlashSrc: "../path/to/font.swf", sColor: "#777", sCase: "upper"}));
};

//--><!]]>
</script>

Here is another example using the named arguments method:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement(named({nWidth:333,nHeight:33,sSelector:"h3.class-h3", sFlashSrc:"http://domain.com/fonts/font.swf", sColor:"#333", sLinkColor:"#777", sBgColor:"#FFF", sHoverColor:"#DDD", sWmode: "transparent", nPaddingTop:0, nPaddingBottom:0}));

//--><!]]>
</script>

Finally, here is the default CSS supplied with sIFR:

/* sIFR Print CSS | Hide Flash headlines from the browser */

.sIFR-flash, .sIFR-flash object, .sIFR-flash embed {
	display: none !important;
	position: absolute;
	overflow: hidden;
	height: 0px;
	width: 0px;
}
span.sIFR-alternate {
	visibility: visible !important;
	position: static !important;
	display: block !important;
	left: auto !important;
	top: auto !important;
}

/* sIFR Screen CSS | These are standard sIFR styles -- do not modify */

.sIFR-flash { 
	visibility: visible !important; 
	margin: 0px; 
}
.sIFR-replaced { 
	visibility: visible !important;
}
span.sIFR-alternate { 
	top: 0px;
	left: 0px; 
	width: 0px; 
	height: 0px; 
	display: block; 
	overflow: hidden;
	position: absolute;
}

/* Decoy styles used to hide the browser text before it is replaced */

.sIFR-hasFlash h1 { 
	letter-spacing: -2px;
	visibility: visible;
	font-size: 32px;
	height: 40px;
}
.sIFR-hasFlash h3 { 
	visibility: visible;
	font-size: 18px;
}

Ahhh, the good ’ol days.

Jeff Starr
About the Author
Jeff Starr = Creative thinker. Passionate about free and open Web.
GA Pro: Add Google Analytics to WordPress like a pro.
Welcome
Perishable Press is operated by Jeff Starr, a professional web developer and book author with two decades of experience. Here you will find posts about web development, WordPress, security, and more »
USP Pro: Unlimited front-end forms for user-submitted posts and more.
Thoughts
When an app won’t hide, you can force it by holding the ⌥ (option) key and clicking anywhere on the desktop.
Currently having a blast redesigning Plugin Planet, so much work so little time.
Thanks to David McCan over at WebTNG for the awesome BBQ Pro review.
Enjoyed a nice mini-vacation with my fam. Great way to recharge and regroup.
Nice little interview with yours truly over at ThemeIsle. WordPress, web dev & more!
Perishable Press celebrating 16 years online! An incredible, rewarding journey.
Thanks to Nicholas Ferrell for his excellent and thorough review of Wutsearch search-engine launchpad.
Newsletter
Get news, updates, deals & tips via email.
Email kept private. Easy unsubscribe anytime.