为什么我的简单JavaScript翻转工作不起作用？ [英] Why doesnt my simple javascript rollover work?
问题描述
大家好我有一个简单的翻转onmouseover效果，我已经尝试了几个脚本，但没有一个工作，谁能告诉我为什么？`
Hi guys I have a simple rollover onmouseover effect, I have tried several scripts but none of them work, can anyone tell me why?`
javascript：
javascript:
<script language="JavaScript" type="text/javascript">
<!--
if (document.images) {
homebuttonup = new Image();
homebuttonup.src = "./images/gym-light.png";
homebuttondown = new Image();
homebuttondown.src = "./images/buttonright.png";
}
function buttondown(buttonname) {
if (document.images) {
document[buttonname].src = eval(buttonname + "down.src");
}
}
function buttonup(buttonname) {
if (document.images) {
document[buttonname].src = eval(buttonname + "up.src");
}
}
// -->
</script>
和链接：
<a href="index.html" onmouseover="buttondown('homebutton')" onmouseout="buttonup('homebutton')">
<img id='Img4Inner' name="homebutton" src='./images/gym-light.png' alt="" />
</a>
推荐答案
**更新2（最后一个lol）**
你目前在a标签上有onmouseout和onmouseover，将它们移动到图片标签，它会起作用：
**UPDATE 2 (last one lol) ** you currently have the onmouseout and onmouseover on the a tag, move them to the image tag and it will work:
你是代码：
<a onmouseout="buttonup('homebutton')" onmouseover="buttondown('homebutton')"
href="http://www.[...].com" style="height:120px;width:100px;">
<img id="Img4Inner" alt="" src="http://[..].com/images/gym-light.png" name="homebutton">
</a>
工作代码：
<a onmouseout="buttonup('homebutton')" onmouseover="buttondown('homebutton')"
href="http://www.[...].com" style="height:120px;width:100px;">
<img alt="" src="http://[...]/images/gym-light.png" onmouseout="buttonup(this)"
onmouseover="buttondown(this)" name="homebutton" id="Img4Inner">
</a>
更新：因为你正在调用锚标签上的函数需要有一个类似于下面的高度和宽度（相应地放置你的身高和宽度）：
Update: because you're invoking the functions on the anchor tags they need to have a height and a width similar to the following (place your height and width accordingly):
<a style="height:25px;width:25px;" href="http://www.[...].com"
onmouseover="buttondown('homebutton')" onmouseout="buttonup('homebutton')">
...
</a>
我出去了......
and I"m out...
我刚刚使用了firebug，用高度和宽度编辑了HTML并且工作正常：
I just used firebug, edited the HTML with the height and width and it worked fine :
）
虽然我确信这样可以解决问题.. doctype设置为< ;！doctype html>并且应该像这里的内容（ LINK ）
and while I"m sure that will solve the problem.. the doctype is set to <!doctype html> and should be something like what's here (LINK)
如果您已经实现了以下方法，图像将具有高度和宽度，并且由于这是正在定位的图像，可能更有意义..
if you would've implemented the below approach, the image would have a height and width, and since that is the image that is being targeting, might make more sense..
http://jsfiddle.net/ETHaM/2/ / p>
http://jsfiddle.net/ETHaM/2/
if (document.images) {
homebuttonup = new Image();
homebuttonup.src = "http://www.placekitten.com/100/100/";
homebuttondown = new Image();
homebuttondown.src = "http://dummyimage.com/100x100/000/fff";
}
function buttondown(obj) {
if (document.images) {
obj.src = eval(obj.name+ "down.src");
}
}
function buttonup(obj) {
if (document.images) {
obj.src = eval(obj.name + "up.src");
}
}
<a href="index.html">
<img id='Img4Inner' onmouseover="buttondown(this)" onmouseout="buttonup(this)" name="homebutton" src='http://www.placekitten.com/100/100/' alt="" />
</a>
这篇关于为什么我的简单JavaScript翻转工作不起作用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
