【www.bbyears.com--浏览器】
1.常规css方法——可以实现IE,Safari,chrome,opera浏览器下文字溢出省略号表示
这是一段测试文字,主要是用来测试文字溢出后是否会用省略号显示。
2.使用ellipsis.xml文件使Firefox支持文字溢出后点点点省略号表示
这段代码调用了跨文件夹路径的ellipsis.xml文件,看Firefox浏览器下是够文字溢出省略号表示。
ps: 在Firefox下上面div内容显示空白,此div内容是:“这段代码添加了跨文件夹路径的ellipsis.xml文件,看Firefox浏览器下是够文字溢出省略号表示”。
这段代码调用了同文件夹路径的ellipsis.xml文件,看Firefox浏览器下是够文字溢出省略号表示。
ps: 在Firefox下上面div文字溢出省略号显示,此div内容是“这段代码调用了同文件夹路径的ellipsis.xml文件,看Firefox浏览器下是够文字溢出省略号表示”。至此,几乎所有主流浏览器都实现文字溢出省略号表示。
这里有个小结论:这个使Firefox浏览器下文字溢出省略号表示的ellipsis.xml文件要在页面的同一目录下,或是下一级目录下(我已测试),要是向上跨文件夹访问或绝对路径访问则失效。原因不详!
js实现代码
<script type="text/javascript">
function formatEllipsis(){
var arr=[];
var aDiv=document.getElementsByTagName("*");
for(var i=0;i if(aDiv[i].className=="ellipsis"){
arr.push(aDiv[i]);
}
}
for(var i=0;i new ellipsis(arr[i]);
}
}
function ellipsis(obj){
this.obj=obj;
this._style=[];
this._width=getStyle(this.obj,"width");
this._height=getStyle(this.obj,"height");
this._fontSize=getStyle(this.obj,"fontSize");
this._lineHeight=getStyle(this.obj,"lineHeight");
var limit=this.format();
//alert(limit);
var _html=obj.innerHTML;
obj.innerHTML=_html.substring(0,limit)+"...";
}
ellipsis.prototype.format=function(){
var _html=this.obj.innerHTML;
var _len=_html.length;
var _lines=Math.floor(this._width/this._lineHeight);
var _cols=Math.floor(this._width/this._fontSize);
return _lines*_cols-3;
}
function getStyle(e,p){
var s= e.currentStyle ? e.currentStyle[p] : document.defaultView.getComputedStyle(e,null)[p];
return parseInt(s);
}
window.onload=function(){
formatEllipsis();
}
</script>
你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn