使用jQuery解决溢出文本省略

本文介绍了一款用于处理网页中字符溢出的jQuery插件,该插件能有效替换溢出文本为省略号,并支持多种浏览器。此外,插件提供了自定义省略符号、文本行数等功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在网页中经常会遇到字符溢出,然后使用省略“...”字符来代替溢出的文本。解决方案有很多种,可以使用服务端程序或客户端(CSS、JS)来处理。

在客户端经常有人会用 CSS的text-overflow属性及配合overflow: hidden来处理,但该属性目前只支持IE、Chrome和Safari浏览器。

至于服务端还更麻烦,因为使用不同字体(不同字体英文字母会有等宽和不等宽问题),中英文字符混排的因素,导致计算复杂。

在这里,由于原先编写的插件有几个致命的bug和依赖于CSS的line-height的定义的问题,现在我重新编写了一个略微完善的插件,也非常感谢同学们的支持。

jQuery Text Ellipsis

参数说明类型默认值
ellipsis省略符号,代替溢出的文本String“...”
tooltip鼠标在元素上悬停时是否显示完整的文本Booleantrue
line元素显示文本的行数Number1

测试通过以下浏览器

IE6+,Firefox3.6+,Chrome10,Opera11,Safari5

示例截图

jquery text ellipsis plugin

下载

jquery-textEllipsis-20110314.rar

转载于:https://www.cnblogs.com/nicolaszhao/archive/2010/04/28/1723195.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值