Fatal编程技术网
  • css/
  • Css Safari+；jQuery thickbox=大量的视觉故障？

Css Safari+；jQuery thickbox=大量的视觉故障？

css flash macos safari

Css Safari+；jQuery thickbox=大量的视觉故障？,css,flash,macos,safari,z-index,Css,Flash,Macos,Safari,Z Index,我需要帮助确定我的一个制作网站出现严重视觉故障的原因。这只发生在Safari-Chrome和所有其他浏览器上 这是一个Drupal 6.x网站，同时运行以下功能： jQuery 1.3.2（Drupal基础/默认） jQuery 1.4.4（对于1.3.2无法处理的某些高级操作，可以通过将jQuery名称空间重写为“$js”来使用它） jQueryUI1.7.3 Thickbox 1.8.2.19（我稍微修改了这个.js） 复制： 单击链接（访问页面）： 在任意5个“coverflow”面

我需要帮助确定我的一个制作网站出现严重视觉故障的原因。这只发生在Safari-Chrome和所有其他浏览器上

这是一个Drupal 6.x网站，同时运行以下功能：

  • jQuery 1.3.2（Drupal基础/默认）
  • jQuery 1.4.4（对于1.3.2无法处理的某些高级操作，可以通过将jQuery名称空间重写为“$js”来使用它）
  • jQueryUI1.7.3
  • Thickbox 1.8.2.19（我稍微修改了这个.js）
复制：

  • 单击链接（访问页面）：
  • 在任意5个“coverflow”面板上单击两次（一次居中），以触发Thickbox内容
  • 加载TB内容后，向左或向右水平调整浏览器窗口的大小
  • 请注意奇怪的背景图像和背景色偏移
  • 在模态系统右上角的5个“选项卡”图标之间切换
  • 在任何时候，使用Web检查器取消选中，然后在任何地方重新检查任何CSS属性
  • 注意这是如何立即清除/修复所有视觉故障的
  • 再次调整浏览器窗口的大小或在其他选项卡之间调整选项卡的大小，并注意到故障再次出现
    • 如果你注意到和我一样的东西，那么最好能得到你的机器配置和Safari版本

    • 以前

    • 调整大小后

    • 禁忌之后

    这些图片说明了一切，就我所能测试的而言，我只能在以下设置中使用Safari重现这个问题：

    • MacPro，6芯至强（2010）
    • OS X 10.6.8
    • 2台显示器：1台23英寸影院显示器（旧银色）+1台27英寸苹果影院显示器
    • ATI Radeon HD 5770（Mac版本，带01.00.436驱动程序）
    • 狩猎5.1+
    我已经用Safari（4.x）的早期版本测试了其他机器和其他机器，但问题根本不存在

    你认为我可以测试什么来找出为什么会发生这种情况

    注：一次只使用一个监视器会产生同样的问题。

    我在运行Windows 7的HP Xeon上签入了Safari 5.1（7534.50）。我没有看到任何小故障

    真奇怪。听起来像是某种比赛状态。可能您的ATI驱动程序中有错误？由于它在重新渲染时会自行修复，也许您可以在某个地方引入一些延迟，这可能会给它更多的时间来正确渲染？

    我在运行Windows 7的HP Xeon上查看了Safari 5.1（7534.50）。我没有看到任何小故障

    真奇怪。听起来像是某种比赛状态。可能您的ATI驱动程序中有错误？由于它在重新渲染时会自行修复，也许您可以在某个地方引入一些延迟，这可能会给它更多的时间来正确渲染？

    解决方案

    我注意到这发生在我们建立的另一个网站上——一个与Drupal网站毫无共同之处的网站，这里有一个问题，除了这个新网站在
    正文中也有一个Flash（SWF）文件，我将CSS属性应用于具有负
    z-index
    值的元素
    
这是因为HTML中
    对象的容器设置为
    

    z-index: -1;

    
为了使定位为重叠的元素，可以单击
    对象
    （否则，无法与
    对象
    顶部的链接进行交互）
    
我可以通过设置位于
    对象顶部的任何元素来永久修复它
    

    z-index: 1; /* or anything > 0 */

    
有了这个解决方案，我在Drupal网站上找到了所有的“z-index:-1”CSS，并且确信在每个选项卡上显示的Thickbox容器中都有一个元素——大的绿色“搜索”输入按钮。它之所以采用这种风格是因为视觉需要（与按钮上的假内部阴影有关）
    

    
我禁用了这个元素的整个
    z-index
    属性，瞧，这些有趣的东西在Drupal网站上永久消失了
    
万岁！我在另一个网站上更尖锐地遇到了同样的问题，这当然是上天的安排
    

    现在，我不确定Safari中的确切错误是什么，但我知道的是页面上的
    对象+其附近的任何元素设置为
    z-index:-1
    等于完全崩溃（在运行Safari 5.x的Mac上）。
    解决方案
    
我注意到这发生在我们建立的另一个网站上——一个与Drupal网站毫无共同之处的网站，这里有一个问题，除了这个新网站在
    正文中也有一个Flash（SWF）文件，我将CSS属性应用于具有负
    z-index
    值的元素
    
这是因为HTML中
    对象的容器设置为
    

    z-index: -1;

    
为了使定位为重叠的元素，可以单击
    对象
    （否则，无法与
    对象
    顶部的链接进行交互）
    
我可以通过设置位于
    对象顶部的任何元素来永久修复它
    

    z-index: 1; /* or anything > 0 */

    
有了这个解决方案，我在Drupal网站上找到了所有的“z-index:-1”CSS，并且确信在每个选项卡上显示的Thickbox容器中都有一个元素——大的绿色“搜索”输入按钮。它之所以采用这种风格是因为视觉需要（与按钮上的假内部阴影有关）
    

    
我禁用了这个元素的整个
    z-index
    属性，瞧，这些有趣的东西在Drupal网站上永久消失了
    
万岁！我在另一个网站上更尖锐地遇到了同样的问题，这当然是上天的安排
    
现在，我不确定Safari中的确切错误是在没有经过严格测试的情况下产生的，但是al