Div代替Alt,Title,Jquery Tooltip , e.pageX

$(function(){
 var x = 10;
 var y = 20;
 $("a.tooltip").mouseover(function(e){
  this.myTitle = this.title;
  this.title = ""; 
  var imgTitle = this.myTitle? "<br/>" + this.myTitle : "";
  var imgUrl =  $(this).children().attr("src");
  var tooltip = "<div id='tooltip'><img src='"+ imgUrl +"' alt='模板预览图'/>"+imgTitle+"<\/div>"; //创建 div 元素
  $("body").append(tooltip); //把它追加到文档中      
  $("#tooltip")
   .css({
    "top": (e.pageY+y) + "px",
    "left":  (e.pageX+x)  + "px"
   }).show("fast");   //设置x坐标和y坐标,并且显示
    }).mouseout(function(){
  this.title = this.myTitle; 
  $("#tooltip").remove();  //移除
    }).mousemove(function(e){
  $("#tooltip")
   .css({
    "top": (e.pageY+y) + "px",
    "left":  (e.pageX+x)  + "px"
   });
 });
})

posted on 2012-12-31 09:18  canny_strive  阅读(190)  评论(0编辑  收藏  举报

导航