Google Chrome 中的 sIFR 文本拉伸/模糊
已回答
下面的最佳答案对于赏金来说是有好处的，但用户 Aaron 的答案是正确的答案。设置：
.sIFR-flash {
width:100%;
}
纠正 Chrome 中的问题。可悲的是，我无法改变我的最佳答案，因为我猜这就是赏金的运作方式。
已回答
我似乎在使用 Chrome 时遇到一些问题，特别是在 Flash 容器中渲染 sIFR 替换的文本（并且模糊）。没有其他浏览器可以做到这一点（在 IE6、7、8、FF、Safari、Opera 中看起来不错）。这是一个已知的错误/有人有解决方法吗？
您可以在此网站上查看以下示例： http://uvph.com/
这是替换代码：
// -- configure sifr
var futura = { src: '/swf/bfuturah.swf' };
sIFR.activate(futura);
sIFR.replace(futura, {
css: [
'.sIFR-root { background-color:transparent; color: #999999; font-size:24px; text-transform:uppercase; }'
],
fitExactly : true,
forceClear : true,
forceSingleLine : true,
selector : 'h2',
transparent : true
});
Answered
The best answer below was good for the bounty, but user Aaron's answer is the correct answer. Setting:
.sIFR-flash {
width:100%;
}
corrects the issue in Chrome. Sadly, I cannot change my best answer as I guess that's how bounties work.
Answered
I seem to be having some issues with Chrome specifically rendering sIFR replaced text stretched out (and blurry) in it's flash container. No other browser does this (looks good in IE6,7,8, FF, Safari, Opera). Is this a known bug/does anyone have a workaround?
Here's an example you can look at on this site: http://uvph.com/
And here's the replace code:
// -- configure sifr
var futura = { src: '/swf/bfuturah.swf' };
sIFR.activate(futura);
sIFR.replace(futura, {
css: [
'.sIFR-root { background-color:transparent; color: #999999; font-size:24px; text-transform:uppercase; }'
],
fitExactly : true,
forceClear : true,
forceSingleLine : true,
selector : 'h2',
transparent : true
});
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（6）
我无法使用@font-face，因为我的字体嵌入效果很差，并且我需要可选择的文本。为了修复 IE9 中 sIFR 的垂直拉伸问题，我添加了
显示：块；
高度：1.45em；
到 .sIFR 闪存
似乎与 IE8 和 Firefox 相匹配
我还使用了 70% 的正文字体大小
它在加载时会产生额外的一点闪烁，但拉伸已经停止。
I can't use @font-face as my font embeds poorly and I need selectable text. To fix the vertical stretching for my sIFR in IE9 I added
display:block;
height:1.45em;
to the .sIFR-flash
which seemed to match up to IE8 and Firefox
I also used a body font-size of 70%
It gives an extra little flicker while loading but the stretching has stopped.
我注意到将 .sIFR-flash 的宽度设置为 100% 似乎可以纠正该问题。
I noticed that setting the width of .sIFR-flash to 100% seems to correct the issue.
嗯，这真的很奇怪。我已将您网站的测试用例上传到我的服务器，并且在 Chrome 中一切正常。 sifr 更好的替代方案是 http://cufon.shoqolate.com/generate/更小更快，但您无法再选择文本
hmmm this is a really strange one. i've uploaded a testcase of your site to my server and everything works fine in chrome. the much better alternative to sifr is http://cufon.shoqolate.com/generate/ its much smaller and much faster, but you cant select the text anymore
使用CSS的@font-face属性。现在所有流行的浏览器（包括 IE 和 Chrome）都支持它。 http://www.useragentman.com/blog /2009/09/20/font-face-in-deep/ 有一篇关于在所有浏览器中使用 @font-face 的非常好的帖子，并且页面本身使用自定义字体。值得检查=）
Use @font-face property of CSS. It is now supported across all popular browsers(including IE and Chrome). http://www.useragentman.com/blog/2009/09/20/font-face-in-depth/ has a very good post about using @font-face across all browsers and the page itself uses custom fonts. Worth checking =)
首先：将“forceSingleLine”设置为“false”。
如果这仍然没有帮助：检查要呈现的文本的 CSS 属性。渲染元素本身（不是父元素！）的显示类型应该是“block”，否则“width: 100%”根本不起作用。如果将 sIFR 应用于具有固定宽度的块元素，则可以实现 Chrome 的最佳结果 - 但这种方法并不总是可行。
First of all: set "forceSingleLine" to "false".
If this still doesn't help: check the CSS properties of the text you want to be rendered. Display-type of the rendered element itself (not the parent!) should be "block", otherwise "width: 100%" has no effect at all. The best results for Chrome can be achieved if sIFR is applied to a block element with fixed width - but this approach will not always be feasible.
我怀疑 Chrome 和 Flash 播放器之间有什么奇怪的地方。就好像 Flash 影片放大不正确一样。当您点击电影时，它会自行修复。
如果在
sIFR.activate()之前设置sIFR.useDomLoaded = false会怎样？I suspect it's something odd between Chrome and the Flash player. It's as if the Flash movie is scaled up incorrectly. The movie fixes itself when you click on it.
What if you set
sIFR.useDomLoaded = falsebeforesIFR.activate()?