如何实现鼠标移动到图片上时切换图片？可以用js实现吗？
<head>
<title>日记本</title>
<link href="test.css" type="text/css" rel="stylesheet"/>
<script type="text/javascript" src="click1.js"></script>
</head>
<body text="10" link="red" alink="red" vlink="red" background="pic/bj4.jpg">
<div class="button1"><!--调用css目前只做位置定位-->
<img src="button/submit1.gif" onclick="openWindow()" onmousemove=""><!--显示图片-->
</div>
<div class="button2"><!--调用css目前只做位置定位-->
<img src="button/reset1.gif">
</div></body>
</html>如何实现鼠标移动到图片上时切换图片？可以用js实现吗？ 如果不可以用js实现的话该怎么做？ 展开
用js写一个切换图片链接的方法，给图片一个鼠标移动的动作，触发这个方法。
<html>
<head>
<style type="text/css">
#hover_el {
border: 0px solid blue;
height: 100px;
width: 100px;
background-color: blue;
}
#hover_el:hover {
border: 0px dashed blue;
}
</style>
<script type='text/javascript'>
window.onload = function() {check_for_hover()};
function check_for_hover() {
var hover_element = document.getElementById('hover_el');
var hover_status = (getStyle(hover_element, 'border-style') === 'dashed') ? true : false;
document.getElementById('display').innerHTML = 'you are' + (hover_status ? '' : ' not') + ' hovering';
setTimeout(check_for_hover, 1000);
};
function getStyle(oElm, strCssRule) {
var strValue = "";
if(document.defaultView && document.defaultView.getComputedStyle) {
strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
}
else if(oElm.currentStyle) {
strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1) {
return p1.toUpperCase();
});
strValue = oElm.currentStyle[strCssRule];
}
return strValue;
};
</script>
</head>
<body>
<div id='hover_el'>hover here</div>
<div id='display'></div>
</body>
</html>
<div id=D1 style=display:none>Welcome</div>
