简单的图片翻转实现方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<img src="bd_logo1_31bdc765.png" data-rollover="logo.jpg">
<script>
window.onload=function () {
for(var i=0;i<document.images.length;i++){
var img=document.images[i];
var rollover = img.getAttribute("data-rollover");
if(!rollover) continue;
(new Image()).src = rollover;
img.setAttribute("data-rollout",img.src);
img.onmouseover=function () {
this.src=this.getAttribute("data-rollover");
};
img.onmouseout=function () {
this.src=this.getAttribute("data-rollout");
};
}
};
</script>
</body>
</html>