鼠标停放显示图片

<script src="js/jquery-1.4.2.js" language="javascript" type="text/javascript"></script>
 <style type="text/css">
 #screenshot
        {
            position: absolute;
            border: 1px solid #ccc;
            background: #333;
            padding: 5px;
           display: none;
            color: #fff;
        }
      
</style>
<script language="javascript" type="text/javascript">

$(function(){
  var x = 10;
  var y = 10;
 $("#testTable a").mouseover(function(e){    
             this.myTitle = this.title;   
             this.title = "";        
              $("body").append("<div id='screenshot'><img src='"+this.myTitle+"' style='width:270px;height:200px' /></div>"); 
               $("#screenshot") .css({ "top": (e.pageY + y) + "px", "left": (e.pageX -140 + x) + "px"}).show("fast");   //设置x坐标和y坐标,并且显示   
                }).mouseout(function(){this.title = this.myTitle;   
                $("#screenshot").remove();   //移除   
                this.myTitle = this.title;
                 });
                });
</script>

posted @ 2011-08-22 15:59  agen  阅读(141)  评论(0)    收藏  举报