我对此并不陌生,但我敢肯定,这很简单。我正在尝试在我的网站上设置多个动画图像按钮。我设置了两个测试按钮,但只有第二个在工作。它们两个都可以正常工作,但是当我将它们加在一起时,只有一个可以工作。我想念什么?提前致谢。
HTML:
<html>
<head>
<title>Default</title><script type="text/javascript" src="script.js"></script>
</head>
<body>
<div align="center"><br>
<a href="url_link"><img style="border: 0px solid ; width: 60px; height:60px;" alt="" src="clickA1.png" id="button1" onmouseover="rollover()" onmouseout="rollout()" onmousedown="down()" onmouseup="rollover()"></a>
</div>
<br />
<div align="center"><br>
<a href="url_link"><img style="border: 0px solid ; width: 60px; height: 60px;" alt="" src="clickB1.png" id="button2" onmouseover="rollover()" onmouseout="rollout()" onmousedown="down()" onmouseup="rollover()"></a>
</div>
<br />
</body></html>
Javascript:
<script>
function rollover () {
document.getElementById ("button1") .src = "clickA2.png"
}
function rollover () {
document.getElementById ("button2") .src = "clickB2.png"
}
function rollout () {
document.getElementById ("button1") .src = "clickA1.png"
}
function rollout () {
document.getElementById ("button2") .src = "clickB1.png"
}
function down () {
document.getElementById ("button1") .src = "clickA3.png"
}
function down () {
document.getElementById ("button2") .src = "clickB3.png"
}
</script>
最佳答案
你们的职能是相互过度的。为button2的功能定义一个不同的名称
例如:
function rollover () {
document.getElementById ("button1") .src = "clickA2.png"
}
function rollover2 () {
document.getElementById ("button2") .src = "clickB2.png"
}