使用ImageBundle的GWT图像精灵能够在IE7和IE6中工作吗？

我正在尝试在我的GWT应用程序中使用ClientBundle以使多个图像作为单个文件发送。我宣布捆绑像这样：使用ImageBundle的GWT图像精灵能够在IE7和IE6中工作吗？

public interface MyResources extends ClientBundle { 
    public static final MyResources INSTANCE = GWT.create(MyResources.class); 

    @Source("icon1.png") ImageResource icon1(); 
    @Source("icon2.png") ImageResource icon2(); 
}

这在Firefox和IE8很大，但在IE7（或更早）整个精灵代替我原来的图像之一的显示出来 - 那就是，ICON1旁边icon3旁边的icon2，等等。在使用IE8-as-IE7模式或兼容性视图的IE8开发人员工具中，我可以看到它显示的文件名像26BEFD2399A92A5DDA54277BA550C75B.cache.png，这正是我所期望的。

那么有没有什么办法让GWT图像精灵在IE7中工作和更低？如果没有，有没有什么办法可以正常降级，这样其他浏览器的用户就可以获得精灵的加速，IE7和IE6用户可以看到正确的但速度更慢的东西？

编辑：的Client Bundle Developer's Guide有使用ClientBundle和@sprite的讨论，并说：“对IE6的支持是不是在这种格式是可行的，因为对DOM结构变化是实行必要的‘窗口’作用。一旦可以在user.agent中区分ie6和ie7，我们可以重新访问对ie6的支持。在当前的实现中，ie6代码将无法正确显示，尽管这纯粹是一个表面问题。“这是怎么回事我的情况，有没有办法解决它？显示所有图像“纯粹是一个整容问题”，但这是一个非常严重的问题。

编辑2：以下是我使用的图像：

public class MyTabHeader extends Composite { 
    @UiField Image icon; 

    public MyTabHeader(String iconPath) { 
    initWidget(uiBinder.createAndBindUi(this)); 
    this.icon.setUrl(iconPath); 
    } 
} 

public class MyTabPanel extends TabPanel { 
    public MyTabPanel() { 
    String icon1 = MyResources.INSTANCE.icon1().getURL(); 
    MyTabHeader tabHeader1 = new MyWidget(icon1); 
    Widget tabContent1 = new HTML("Content 1"); 
    add(tabContent1, tabHeader1); 

    String icon2 = MyResources.INSTANCE.icon2().getURL(); 
    MyTabHeader tabHeader2 = new MyWidget(icon2); 
    Widget tabContent2 = new HTML("Content 2"); 
    add(tabContent2, tabHeader2); 
    } 
}

来源

2010-03-08 aem

使用Image.setUrl的（MyResources.INSTANCE.icon1（）的getURL（））的问题。

您应该使用Image.setResource（MyResources.INSTANCE.icon1（）），而不是

来源

2010-03-11 15:55:36 Chi

谢谢，这样做！ – aem 2010-03-11 17:14:11

你如何使用ImageResource？

您引用的问题仅在与CssResource @sprite指令一起使用时才存在。

如果您通过实例化一个Image对象，而不是使用它，它应该工作的罚款在IE6 + 7

来源

2010-03-11 05:28:58 Chi

我已经编辑我的问题，包括你要的信息。我没有使用@sprite，这使得这尤其令人困惑。 – aem 2010-03-11 14:50:41

我在IE7中得到了类似的问题过了，主要是因为我没有选择，只能使用“的getURL（）“选项，因为我需要将资源设置为背景图像。即不是像（以上面的例子）：

this.icon.setUrl(MyResources.INSTANCE.icon1().getURL());

我需要做的：

this.mypanel.getElement().getStyle().setBackgroundImage("url("+MyResources.INSTANCE.icon1().getURL()+")");

然而对于以上代码的第一位的解决方法是做“this.icon.setResource （MyResources.INSTANCE.icon1（））“，它不适用于设置背景图像，因为它只是期望一个字符串。在IE8和其他浏览器中，第二位代码工作正常。但在IE7中，它显示整个图像包（就像上面解释的原始问题）。

那么有没有什么办法可以使用GWT ResourceBundle中的图像来设置背景图像，以便它能够在IE7中正常工作？

来源

2010-04-07 08:37:38 Riza

里扎，请为此创建一个新问题 - 它会让人们更容易看到并回答您的问题。 – aem 2010-04-07 14:43:27

您可以使用DataResource与IE7

if(BrowserUtils.getIEVersionNumber() < 8 && BrowserUtils.isBrowserIE()){ 
    icon = new Image(resources.iconIE().getSafeUri()); 
} else { 
    icon = new Image(resources.icon()); 
} 
... 
in client bundle: 

@Source("icon.png") 
DataResource iconIE(); 

@Source("icon.png") 
imageResource icon();

来源

2012-05-09 01:27:43 Rebzie

使用ImageBundle的GWT图像精灵能够在IE7和IE6中工作吗？

回答

相关问题