视频的存在会影响Safari中的Cufon文本

时间:2011-02-13 19:17:37

标签: jquery video safari cufon

网站:http://ghostpool.com/wordpress/slide/

如果单击左下角的“+”按钮以显示页脚,则cufon标题文本会在Safari中快速移动或消失(使用5.0.3)。没有其他浏览器出现此问题。如果我从滑块中的第五张幻灯片中移除或悬停在视频上,或默认情况下显示页脚而没有切换功能,则问题就会消失。这意味着Safari中存在视频和cufon一定存在问题。我们非常感谢您解决此问题的任何帮助。

2 个答案:

答案 0 :(得分:1)

在向Cufon的创造者询问这个错误后,他回复了这个

https://github.com/sorccu/cufon/issues/199

” 嗨,我之前没有遇到过这个问题,但你可能想尝试将z-index(几乎除了auto之外的任何值)添加到定位的cufon元素而不是删除定位。它可能会成功。或者,您可以尝试将z-index添加到视频本身(或者如果它尚未定位,则将其定位)。

请告诉我它是怎么回事。此外,我认为这个问题可能会影响画布。 Safari团队可能会将它固定在他们身边(迟早......)该网站上还有其他可能相关的问题,例如子菜单有时会被部分渲染。请参阅附件(如果有效)。

下一个版本(1.10)实际上不再使用定位,所以我猜问题可能会消失。但请不要问它什么时候发布,因为我不知道。

-Simo “

似乎添加除auto之外的任何z-index值也会解决此问题。使用position:static限制了对Cufon文本的控制太多

我还发现使用起来更简单

*.cufon-canvas { 
  z-index: 0;
}

而不是GhostPool建议的修复。

我唯一不喜欢这些修复的方法是,如果您尝试在任何cufon块中嵌套span标记并尝试更改其position属性。它忽略了z-index修复。

答案 1 :(得分:0)

好的,我已经设法用CSS修复解决了这个问题。

cufon文本被赋予一个位置:默认为相对,你需要用position:static来否定它。将以下内容添加到样式表中。

  h3 cufon,
  h3 canvas {
  position: static !important;
  }

将h3更改为您要应用它的任何元素。你需要读取位置:相对样式到Internet Explorer,因为它不能处理位置:静态太好了。因此,将其添加到IE特定样式表中。

 h3 cufon,
 h3 canvas {
 position: relative !important;
 }