鼠标经过小图，显示大图

    <div width="40" height="40" alt="鼠标透过小图，显示大图" /></a></li>        <li><a href="cc.jpg" width="40" height="40" alt="鼠标透过小图，显示大图" /></a></li>      </ul>     </div><style>*{padding:0px;margin:0px;}li{list-style:none; float:left;margin-left:10px;}.container{  width:1000px;  height:600px;  margin:0 auto;  background:#FFC;}#preview { position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; }</style><script>/* * Image preview script  * powered by jQuery (http://www.jquery.com) *  * written by Alen Grakalic (http://cssglobe.com) *  * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery * */ this.imagePreview = function(){/* CONFIG */xOffset = -30;yOffset = 10;// these 2 variable determine popup's distance from the cursor// you might want to adjust to get the right result/* END CONFIG */$("a.preview").hover(function(e){this.t = this.title;this.title = "";var c = (this.t != "") ? "<br/>" + this.t : "";$("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>"); $("#preview").css("top",(e.pageY - xOffset) + "px").css("left",(e.pageX + yOffset) + "px").fadeIn("fast");    },function(){this.title = this.t;$("#preview").remove();    });$("a.preview").mousemove(function(e){$("#preview").css("top",(e.pageY - xOffset) + "px").css("left",(e.pageX + yOffset) + "px");});};// starting the script on page load$(document).ready(function(){imagePreview();});</script>