一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

jquery文字超出时用省略号代替在鼠标指向显示全部

时间:2014-06-21 编辑:简简单单 来源:一聚教程网

jquery代码

 代码如下 复制代码

$(document).ready(function(){
$('div.marks').live('mouseover',function(e)
{
_text=$(this).text();
_tooltip="
"+_text+"
";
$("body").append(_tooltip);
$("#tooltipdiv").show();

$("#tooltipdiv")
.css({
"top":(e.pageY+10)+"px",
"left":(e.pageX+10)+"px"
}).show("fast");
});

$('div.marks').live('mouseout',function(e){
$("#tooltipdiv").remove();
});


$('div.marks').live('mousemove',function(e){
$("#tooltipdiv")
.css({
"top":(e.pageY+10)+"px",
"left":(e.pageX+10)+"px"
}).show();
});
});


用的css样式:

 代码如下 复制代码

.marks{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
wzy:expression_r(void(this.title=this.innerText));
}

注意:在文章前面我们需要载入jquery插件哦,本例子只介绍了实现代码并没有说用到插件了。

热门栏目