How to disable sIFR for headings in a specific div

Question

Hi,

Is it possible to have sIFR 2 replace headings in a content like #content, but not in #sidebar?

Thanks,

osu

Answer 1

You need to use a more specific selector in your replace statement.

Instead of something like this:

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

You need a more specific selector:

if(typeof sIFR == "function"){
    sIFR.replaceElement("#content h1", named({sFlashSrc: "./vandenkeere.swf", sColor: "#000", sCase: "upper"}));
};

Answer 2

Thanks for getting back to me.

I'm using this code, but the h2 tags etc. are still affected in the #sidebar div because I can't see them (although there's no flash animation there, so maybe this is a css issue?):

if(typeof sIFR == "function"){
sIFR.replaceElement(named({
 sSelector:"#content h1,#content h2,#content h3,#content h4,#content h5,#content h6",
 sFlashSrc:"/wp-content/themes/name/sifr/fssophie.swf",
 sColor:"#dd2527",
 sLinkColor:"#dd2527",
 sBgColor:"#ffffff",
 sHoverColor:"#ed292b",
 nPaddingTop:0,
 nPaddingBottom:0,
 sFlashVars:"textalign=left&offsetTop=0"}));};

Answer 3

Got it!

I had the same problem as you... go into the sIFR-screen.css, and you'll see

.sIFR-hasFlash h4 { visibility: hidden; letter-spacing: -5px; font-size: 21px; }

This means that all h4's will be hidden if the computer has flash - disable it, and provide more specific CSS if you like...

origninal problem... You put sIFR on the page, all the Headers disapear... you enable some specific #ids .. great, but the rest are still dead... until you tweak sIFRs css...