javascript技巧--鼠标经过时图片发生改变_js鼠标移过图片变文字-优快云博客

本文链接：https://blog.youkuaiyun.com/jchbms128/article/details/8235516

本文介绍了一种使用JavaScript实现的鼠标悬浮时图片自动切换的方法，通过定义不同状态下的图片源来实现在不同条件下的动态展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

javascript技巧--鼠标经过时图片发生改变

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>

star1=new Image();  star1.src="jkjy.gif"
star2=new Image();  star2.src="wmc.gif"
star3=new Image();  star3.src="lb.gif"
star4=new Image();  star4.src="jzw.gif"
function showpicture(star)
{
document.showpad.src=star
}
</script>
<style type="text/css">
<!--
#Layer1 {
	position:absolute;
	width:200px;
	height:115px;
	z-index:1;
	left: 332px;
	top: 390px;
}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<H1>
  <A href="images/歌词背景.gif"></A>
  <img src="images/jkjy.gif" name="showpad" width="400" height="400" border="0" onmouseover="this.src='images/wmc.gif'" onmouseout="this.src='images/jzw.gif'" onmouseover="'images/lb.gif'">
  <img src="images/jzw.gif" name="showpad" width="400" height="400" border="0" onmouseover="this.src='images/lb.gif'" onmouseout="this.src='images/jkjy.gif'" onmouseover="'images/lb.gif'">
</H1>
</body>
</html>