jquery鼠标悬浮显示提示文字_H5之家 - 中国HTML5教程资源分享第一站

[摘要]本文是对jquery鼠标悬浮显示提示文字的讲解，附上jquery源代码，源码可直接使用，大学IT网整理，与大家分享！

下面是关于jquery鼠标悬浮显示提示文字的详细代码,由最懂大学生的IT学习网站-大学IT网（）整理分享！

<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>跨浏览器事件处理示例</title> <style type="text/css"> div { font-size: 16px; font-family: Verdana; height: 60px; width: 60px; text-align: center; line-height: 60px; float: left; margin: 12px; border: 3px outset red; background-color: #FF0; cursor: pointer; } p { font-size: 16px; font-family: Tahoma; clear: left; margin-left: 6em; } </style> <script type="text/javascript"> function over (evt) { evt = evt ? evt : window.event; var target = evt.target ? evt.target : evt.srcElement; if (target) { target.style.borderStyle = "inset"; document.getElementsByTagName("p")[0].innerHTML = "您选择了" + target.innerHTML + "浏览器。"; } } function out (evt) { evt = evt ? evt : window.event; var target = evt.target ? evt.target : evt.srcElement; if (target) { target.style.borderStyle = "outset"; document.getElementsByTagName("p")[0].innerHTML = ""; } } window.onload = function () { if (document.attachEvent) { var divs = document.getElementsByTagName("div"); for(var i = 0; i < divs.length; i++) { divs[i].attachEvent("onmouseover", over); } for(var i = 0; i < divs.length; i++) { divs[i].attachEvent("onmouseout", out); } } if (document.addEventListener) { var divs = document.getElementsByTagName("div"); for(var i = 0; i < divs.length; i++) { divs[i].addEventListener("mouseover", over, false); } for(var i = 0; i < divs.length; i++) { divs[i].addEventListener("mouseout", out, false); } } } </script> </head> <body> <div>IE</div><div>Firfox</div><div>Opera</div><div>Safari</div> <p></p> </body> </html>

好啦，看完这个由jquery技术实现jquery鼠标悬浮显示提示文字功能的源代码后是否对实现相关功能更加明白了呢？如果还有不懂的地方可以加我的QQ（2519494580）联系我哦^_^！

本文由最懂大学生的IT学习网站-大学IT网（）整理，转载请注明出处！