如何让颜色在 sIFR 3 r436 中起作用？答案

【问题标题】：How do I get colors to work in sIFR 3 r436?如何让颜色在 sIFR 3 r436 中起作用？
【发布时间】：2023-03-31 06:50:01
【问题描述】：

我有一个demo page up here;您可以查看源代码以了解我要执行的操作。

如您所见，除了颜色之外，它的一切似乎都正常工作。我正在尝试将颜色设置为蓝色（#0000ff），但它保持为黑色。我为我的字体创建了一个自定义 SWF 文件，嵌入了单个字体的四种不同变体，以适应每个 these instructions 的不同样式（因为这个特定的字体系列将常规、粗体、斜体和粗斜体存储为四个不相交的字体名称)。

为了后代，我将从我链接到的演示页面中粘贴一些源代码：

<style type="text/css">
h1.sifr {
    color: #0000ff;
    font-family: 'Myriad Pro';
    font-size: 1.75em;
    margin-bottom: 0;
}
</style>
<script type="text/javascript">
var myriad_pro = {src: 'myriad_pro.swf'};
sIFR.activate(myriad_pro);
sIFR.replace(myriad_pro, {
    selector: 'h1.sifr',
    css: {
        '.sIFR-root': {'color': '#0000ff', 'font-family' : 'Myriad Pro'},
        'em': {'color': '#0000ff', 'font-family' : 'Myriad Pro Italic' , 'font-style' : 'plain'},
        'strong': {'color': '#0000ff', 'font-family' : 'Myriad Pro Bold' , 'font-weight' : 'normal'},
        'em strong, strong em': {'color': '#0000ff', 'font-family' : 'Myriad Pro Bold Italic' , 'font-style' : 'plain', 'font-weight' : 'normal'}}
    }
);
</script>

我忘记了什么？如何让颜色发挥作用？

【问题讨论】：

标签： javascript css flash sifr

【解决方案1】：

我让它工作了here。唯一的区别是我的 sifr 文本包含在链接中，并且在鼠标悬停时会改变颜色。

我的脚本如下所示：

 <script language="javascript" type="text/javascript">
        //sIFR.useStyleCheck = true;
        var eurostile = {
            src: '/images/eurostile.swf'};
        sIFR.activate(eurostile);
        sIFR.replace(eurostile , {selector: "div#mainNav li", wmode: "transparent", 
        css: [
             'a { text-decoration: none; color: #666666; }'
            ,'a:link { color: #666666; }'
            ,'a:hover { color: #00299b; }'
        ]});
        sIFR.replace(eurostile , {selector: "div.menuHeadingText", wmode: "transparent"
        ,css: [
            '.sIFR-root { color: #FFFFFF; }',
            'a { text-decoration: none; color: #FFFFFF; }'
            ,'a:link { color: #FFFFFF; }'
            ,'a:hover { color: #FF5A00; }'
        ]});

        sIFR.replace(eurostile , {selector: "h2.boxHeading", wmode: "transparent"
        ,css: [
            '.sIFR-root { color: #666666; }'
        ]});

希望对你有帮助。

/克劳斯

【讨论】：

我从您链接到的页面中获取了 HTML、CSS 和 JS，并将其更改为加载我自己的 SWF 文件。颜色起作用了。但是，这仅适用于一种字体（Myriad Pro Regular）。但是，当我尝试混合上述不同的字体（Regular、Bold、Italic 和 Bold Italic）时，它不起作用——它没有显示 any 文本！所以看起来我可以让颜色工作，或者我可以让多种字体工作，但不能同时工作。

【解决方案2】：

您可能需要将颜色值大写，不应该是font-style: normal 而不是plain？

【讨论】：

感谢您的建议，但没有奏效。 =/你是正确的，它是字体样式：正常，虽然那部分已经工作了，所以我猜它只是在看到它无法识别的东西时假设它是正常的。我尝试了#0000ff、#0000FF、rgb(0,0,255) 和 RGB(0,0,255) 均无济于事。

【解决方案3】：

好的，对不起，伙计们。事实证明，我只是想太多了。最后，我最终重新导出了我的 SWF 文件（我想我第一次可能做得有些不正确）并大大降低了我的 JavaScript。我仍然在 Flash 文件中包含了所有“四种”字体的嵌入副本——我将主动态文本框设置为 Myriad Pro/Regular，然后我创建了另外 3 个设置为粗体的动态文本框（其中没有文本）、斜体和粗斜体。然后我确保在所有这些上单击“字符嵌入”并确保包含我想要的字符。

最后我的 JavaScript 看起来像这样：

<script type="text/javascript">
var myriad_pro = {src: 'myriad_pro.swf'};
sIFR.activate(myriad_pro);
sIFR.replace(myriad_pro, {
    selector: 'h1.sifr',
    css: {
        '.sIFR-root': {'color': '#0000ff'}
    }
});
</script>

我不需要更改字体或其他任何东西，但我仍然必须确保所有四个都包含在 Flash 文件中。回想起来，当我说font-family: "Myriad Pro Italic" 等时它确实工作似乎有点奇怪，因为这在技术上不是字体名称。但无论出于何种原因导致颜色冲突，所以当我只是将它称为普通的旧“Myriad Pro”并让它找出斜体和粗体时，一切都奏效了。和@Mark - 小写/大写颜色十六进制代码无关紧要。但是它确实必须是完整的 6 位十六进制代码（即 #00f 不起作用）。

【讨论】：