ExtJS4太优雅...需要帮助ie8组件渲染

我正在处理ExtJS4应用程序 - 自定义报告应用程序。ExtJS4太优雅...需要帮助ie8组件渲染

ExtJS4通过使用图像和表格（修改标记）自动回退所有css3，使用可怕的优雅降级原则。正因为如此，它可怕地膨胀了已经臃肿的标记，并用默认图像改变了所有的渐变/边界。

我不确定除了css3元素还有什么变化，但这里是应用程序截图。

这是IE8： Bad - IE8

这是谷歌浏览器： Good - Chrome

...

除了具有检查所有的标记，并撤消这些可怕设计决策
除了不必重新创建所有的图像的现有设计
匹配除了具有修改的核心文件，迫使优雅降级不发生了不支持X-NLG浏览器，X-NBR等

更新2012年11月23日

煎茶片： Bad - IE8

ExtJS的核心覆盖： Good - IE8

是否有任何其他方式或设置，JavaScript或青菜，来处理所有的这些兼容性问题更容易？

来源

2012-11-03 chemoish

您已经阅读主题化导向？这包含在“支持传统浏览器”下：http://docs.sencha.com/ext-js/4-1/#!/guide/theming –

感谢您的提醒。我没有尝试过，但我会。然而，这不是我想要的解决方案，因为我不想做＃2。我是Chris Coyier对浏览器兼容性的足够好或者“meh”原则的忠实粉丝。 ExtJS4每个组件已经有8个奇怪的嵌套容器，旧式浏览器要求这些容器被重写为反语义标记（表格中的所有内容）！ – chemoish

为什么人们放弃投票 - 没有回应）： – chemoish

因此，无法找到答案，我会提供我采取的实施。

正如您在上面看到的，这个复杂的ExtJS 4.1应用程序具有复杂的设计。 sencha slice工具不起作用（但是，如果你想保留所有sencha默认值并且只是改变应用程序的基本颜色，可能是基于SASS变量的话，它会工作吗？）。

另一方面，您可以看到Ext覆盖效果如何。一个非常坚实的过渡，看起来相同的95％（或克里斯Coyier会说，“呃，够好”）。

下面是我的实现：

Ext.application({ 
    ... 
    init: function() { 
     // Override CSS3BorderRadius value which caused render problems in <IE9 when false. 
     Ext.supports['CSS3BorderRadius'] = true; 

     // Hack-ish remove class sniffers from Ext.EventManager (which attaches modrnizer type classes onto the body) 
     Ext.getBody().removeCls('x-nbr x-nlg'); 
    } 
    ... 
});

这个实现是在优雅：

“我” 会写的跨浏览器CSS，将工作。我不需要煎茶来用我们的“更智能”，更可怕的CSS来覆盖我的CSS。
我了解旧版浏览器无法处理圆角 - 我不想要它们。
据我所知，IE不能处理线性渐变 - 我不想默认情况下的图像。我想使用filter：progid。
我不想煎茶TO臃肿我的自定义图像，嵌套容器几十个和表GALORE几十MARKUP

GG希望这可以帮助别人

来源

2012-11-20 03:40:35 chemoish

这就像魅力...... :) –

ExtJS4太优雅...需要帮助ie8组件渲染

回答

相关问题