Javascript HTML滚动按钮图像：如何使用Internet Explorer？_Javascript_Html

Javascript HTML滚动按钮图像：如何使用Internet Explorer？

javascript html

Javascript HTML滚动按钮图像：如何使用Internet Explorer？,javascript,html,Javascript,Html,我有一段简单的代码，它不适用于Internet Explorer，但适用于Chrome、Firefox等。这是一个简单的按钮图像“滚动” <html> <head> </head> <body> <img src="p1.png" name="img1" onMouseOver="document.images[0].src='p2.png'" onMouseOut="document.images[0].src='p1.png'

我有一段简单的代码，它不适用于Internet Explorer，但适用于Chrome、Firefox等。这是一个简单的按钮图像“滚动”

<html>
<head>
</head>
<body>
    <img src="p1.png" name="img1"  onMouseOver="document.images[0].src='p2.png'" onMouseOut="document.images[0].src='p1.png'" ></a>
</body>
</html>

IE 6、7、8有什么问题

onmouseover="this.src='p2.png'"

使用此方法而不是document.images…

另一种方法（如果您需要滚动更改其他内容，也可以使用此方法）：

（3个例子，你的，赛义德的，这一个）

注：您的打开标记是

，但关闭标记是

如果图像没有那么重，您可以尝试不同的方法，例如声明两个图像并隐藏其中一个。然后，使用javascript在可见图像上滚动时，将其隐藏并显示另一个图像。

将代码更改为：

<html>
    <head>
    </head>
    <body>

        <img src="p1.png" name="img1"  onMouseOver="this.src='p2.png'" onMouseOut="this.src='p1.png'" />

    </body>
</html>

并添加CSS

hiddenPic

类代码：

.hiddenPic{display:none；}

其他预加载滚动图像的方法可以使用或。

完美工作的代码来完成。Stighy先生：

<html> 
<head> 
  <style type="text/css">
</head> 
<body> 
 <img src="../a_b_c/a.jpg" alt="" onMouseOver="this.src='b.jpg'" onMouseOut="this.src='a.jpg'" onClick="this.src='c.jpg'" class="style1"></a>
</body> 
</html>

我想我们把图像搞砸了，就是这样。。。p、 s.Giulio在和你较劲。

我试过IE 6,7,8为什么你不使用jquery，这将解决很多问题？在IE 9中工作：@ftom2-jquery解决跨浏览器问题，但代价是让一切都变得更慢。document.getElementById（）比$（）快得多，适用于所有浏览器。@SpaceBeers-为什么不换一种方式做每件事，而不是像你现在这样做，因为其他人有“更好”的做事方式呢？：-）在页面已经加载之后，您可以在页面底部使用javascript加载其他图像。没有多余的元素，用户看不到额外的加载时间。确实，只有在您希望滚动图像在其他一切之前尽快准备好时，隐藏的预加载才有效。虽然这通常不是问题所在，但如果必须非常快地准备好过渡，它有时会很有用。

<img src="p2.png" class="hiddenPic" />
<!-- loading (hidden) rollover image before all the other page data -->

<html> 
<head> 
  <style type="text/css">
</head> 
<body> 
 <img src="../a_b_c/a.jpg" alt="" onMouseOver="this.src='b.jpg'" onMouseOut="this.src='a.jpg'" onClick="this.src='c.jpg'" class="style1"></a>
</body> 
</html>