jquery implementation:
<ptml xmlns= "http://www.w3.org/1999/xhtml" > <pead> <meta http-equiv= "Content-type" content= "text/" html charset=gb2312 "/> <title>jquery implementation simple text hint </title> <style type=" Text/css "> #preview {border:1px Solid #cccccc; Background: #9900CC; color: #fff; padding:5px; Display:none; Position:absolute;} </style> <script type= "Text/javascript" src= "Http://img.jb51.net/jslib/jquery/jquery.js" ></script > </pead> <body> put the mouse here 1 <br><br><br> put the mouse here 2 <br><br><br> mouse Put it here 3 <br><br><br> put the mouse here 4 <br><br><br> put the mouse here 5 <script type= "Text/javascri PT "> This.imagepreview = function () {/* CONFIG */xoffset = 10; Yoffset = 30; You can set the offset value/* End CONFIG/$ ("A.preview"). Hover (function (e) {$ ("body"). Append ("<div id= ' preview" >jquery implement simple text Hint </div> "); $ ("#preview"). CSS ("Top", (E.pagey-xoffset) + "px")-CSS ("left", (E.pagex + yoffset) + "px"). FadeIn ("slow"); The function () {$ ("#preview"). Fadeout ("fast"); }); $ ("A.preview"). MouseMove (function (e) {$ ("#preview"). CSS ("Top", (E.pagey-xoffset) + "px")-CSS ("left", (E.pagex + yoffs ET) + "px"); }); }; The page finishes loading execution $ (document). Ready (function () {Imagepreview (); }); </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
