<HTML> <HEAD> <!-- meta 解释 : http://www.haorooms.com/post/html_meta_ds --> <meta http-equiv="content-Type"content="text/html;charset=utf-8"> <TITLE>js鼠标移入移出效果</TITLE> <style> *{ margin:2;padding:0;} .top{background:#5DF5FD; height:20px; position:fixed; z-index:8000;width:100%} .width99{width:99%;padding:0;} input{ background-color: yellow; border-style: solid; border-color: red } </style> <script type="text/javascript" src="D:/Old PC/D/html/jQuery/jquery-3.1.0.js" ></script> <script type="text/javascript"> $(function(){ var vvv = "eee"; $("#mybutton").mouseover(function(){ $("#mydiv").text(vvv); }) $("#mybutton").mouseout(function(){ $("#mydiv").text(""); }) }) </script> </HEAD> <BODY> <button id ="mybutton" >aaaaaaaaaaaa</button> <div id="mydiv"></div> <input type="image" id="imgbtn" src="http://picm.photophoto.cn/015/037/003/0370031902.jpg" onmouseover="this.src='http://picm.photophoto.cn/015/037/003/0370030833.jpg'" onmouseout="this.src='http://picm.photophoto.cn/015/037/003/0370031902.jpg'" onmousedown="this.src='http://picm.photophoto.cn/015/037/003/0370030688.jpg'" /> </BODY> </HTML>