jquery Preview Picture

<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml" ><Head>    <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" />    <title>jquery Picture Preview</title>    <Scripttype= "Text/javascript"src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></Script>    <Scripttype= "Text/javascript">        varShowImage= function() {Xoffset= Ten; Yoffset=  -; JQuery ("#imglist"). Find ("img"). Hover (function(e) {jQuery ("" +  This. SRC+ "'/>"). AppendTo ("Body"); JQuery ("#imgshow"). CSS ("Top", (E.pagey-xoffset)+ "px"). CSS (" Left", (E.pagex+yoffset)+ "px"). FadeIn ("Fast"); }, function() {JQuery ("#imgshow"). Remove ();            }); JQuery ("#imglist"). Find ("img"). MouseMove (function(e) {jQuery ("#imgshow"). CSS ("Top", (E.pagey-xoffset)+ "px"). CSS (" Left", (E.pagex+yoffset)+ "px")            });        }; JQuery (document). Ready (function() {ShowImage ();    }); </Script>    <styletype= "Text/css">Body{width:600px;margin:0 Auto;}img{Border:None;}Ul,li{margin:0;padding:0;        }Li{List-style:None;float: Left;Display:inline;Margin-right:10px;        }#imglist img{width:150px;Height:120px;}#imgshow{position:Absolute;Border:1px solid #ccc;background:#333;padding:5px;Color:#fff;Display:None;     }    </style></Head><Body><ulID= "Imglist">    <Li><a><imgsrc= "Http://www.jquery001.com/images/demo/35624390.jpg"alt= "Hoi An Xuan" /></a></Li>    <Li><a><imgsrc= "Http://www.jquery001.com/images/demo/35624390.jpg"alt= "Hoi An Xuan" /></a></Li></ul></Body></HTML>

Original address: http://www.jquery001.com/jquery-image-preview.html

jquery Preview Picture