Html 如何让IE7在悬停上覆盖另一个图像_Html_Css_Internet Explorer

Html 如何让IE7在悬停上覆盖另一个图像

html css internet-explorer

Html 如何让IE7在悬停上覆盖另一个图像,html,css,internet-explorer,Html,Css,Internet Explorer,我试图让IE在图像悬停时覆盖它 <?xml version="1.0" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <header> <

我试图让IE在图像悬停时覆盖它

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<header>
    <title>Test</title>
    <link href="logotestIE.css" rel="stylesheet" type="text/css">
</header>
<body>
<ul class="letterlist">
    <li><img class="grayscale" src="http://mdsystem.com/image/new_start/logos/logo_anadolu.gif" /></li>
    <li><img class="grayscale" src="http://mdsystem.com/image/new_start/logos/logo_aston_martin.gif" /></li>
</ul>




</body>
</html>


试验

有什么提示吗

编辑：

好吧，我的问题表述得很糟糕：我想在图像上悬停。悬停时，应将其放置在下一个悬停的顶部

现在悬停的图像位于下一个图像的下方

最好的方法是创建一个精灵。在任何照片/图像软件（photoshop）中，拍摄两张图像并将它们放在同一个文件中，一个放在另一个下面

#button:hover { background-position:0 0; }

示例：

然后创建一个元素，为其提供图像的背景，并将其定位为仅显示希望在悬停之前显示的图像

HTML

<a href="#" id="button"> </a>

然后将

：悬停在元素上并将其定位到下一个图像
#button:hover { background-position:0 0; }

jsFiddle:
来源：
是否将图像置于悬停状态？你的意思是用顶部图像替换底部图像吗？与IE无关。这是一般的javascript/css/dom内容。尝试使用jquery。这使得这些事情变得微不足道。好吧，我很糟糕地提出了这个问题：我想在图像上悬停。悬停时，它现在应该在下一张图片的上方，悬停的图片在下一张图片的下方<代码>

标签不能替代

标签！它们是完全不同的东西。@simplex123我的回答对你有帮助吗？你需要帮助吗？不，对不起。不是这样。我试图让这个效果（）在IE7中工作。我发现IE不支持CSS3转换，所以我使用了微软的专有过滤器。问题是：当我将图像悬停时，它会变大（我想要的），但悬停的图像不会以其全尺寸显示，而是在边缘处被截断。我只是想在IE中获得与Firefox或任何其他现代浏览器相同的效果