jquery.ellipsis根据宽度(不是字数)进行内容截断,支持多行内容
jquery.ellipsis
自动计算内容宽度(不是字数)截断,并加上省略号,内容不受中英文或符号限制。
如果根据字数来计算的话,因为不同字符的宽度并不相同,比如l和W,特别是中英文,最终内容宽度会有很大的差异。
jquery.ellipsis.js 依赖jquery,使用方式
$(dom).ellipsis({maxWidth:120,maxLine:2});
maxWidth,最大宽度 maxLine,最大亮度,标题啊什么的显示通常需要支持多行内容显示。默认为1
jquery.ellipsis.unobtrusive.js 依赖jquery.ellipsis.js,非必须项,这个是用来支持用data-标签来控制行为 使用方式:
<p data-ellipsis="true" data-ellipsis-max-width="200" data-ellipsis-max-line="2">
...
</p>
引入这个js即可自动根据元素上的data属性来处理,不需要写额外的脚本
源码及Demo下载:https://github.com/thinhunan/jquery.ellipsis
jquery.ellipsis根据宽度(不是字数)进行内容截断,支持多行内容的更多相关文章
- jquery.ellipsis.js段落超出省略号插件
为了实现在段落尾部超出文字替换为省略号,自己写的插件,并作了简单的优化. 下面给出脚本演示页面及注释,在此之前介绍一下插件参数 1.lineNum:数字.限制段落的行数 2.english:布尔.英文 ...
- jquery完美实现textarea输入框限制字数
<html> <head> <title> jquery完美实现textarea输入框限制字数</title> <meta http-equiv= ...
- jQuery计算文本宽度和input标签根据输入字符动态自适应宽度的实现
jQuery计算文本宽度的原理是利用html提供的<pre>标签,向dom中动态添加<pre>标签,标签里的内容就是要测试长度的文本,获取完长度之后再删除刚才添加的<pr ...
- JQUERY 获取 DIV 宽度与高度(width,padding,margin,border)
一般讲的宽度指的是内容宽度,但一个 div 的实际宽度不仅只于内容宽度,尤其在做 CSS 排版时更不能搞错,必须同时考虑 Padding.Border 与 Margin 的宽度,四个加起来才是 di ...
- jquery插件——仿新浪微博限制输入字数的textarea
内容链接地址:http://www.cnblogs.com/jone-chen/p/5213851.html: <!DOCTYPE html> <html> <head& ...
- jquery检测屏幕宽度并跳转页面
jquery检测屏幕宽度并刷新页面 var owidth = ($(window).width()); //浏览器当前窗口可视区域宽度 if(owidth<640){//小于640跳转一个网址, ...
- jquery里的宽度详解
在jQuery中,width()方法用于获得元素宽度:innerWidth()方法用于获得包括内边界(padding)的元素宽度,outerWidth()方法用于获得包括内边界(padding)和边框 ...
- JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别
整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...
- JavaScript和jquery中的宽度
Javascript: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document ...
随机推荐
- 『cs231n』作业3问题1选讲_通过代码理解RNN&图像标注训练
一份不错的作业3资料(含答案) RNN神经元理解 单个RNN神经元行为 括号中表示的是维度 向前传播 def rnn_step_forward(x, prev_h, Wx, Wh, b): " ...
- bzoj3262: 陌上花开 三维偏序cdq分治
三维偏序裸题,cdq分治时,左侧的x一定比右侧x小,然后分别按y排序,对于左侧元素按y大小把z依次插入到树状数组里,其中维护每个左侧元素对右侧元素的贡献,在bit查询即可 /************* ...
- OAF 供应商门户添加功能标签后获取当前供应商VendorId的方法
一种是参考管理页面 /oracle/apps/pos/supplier/webui/SuppDtPG 在目标页面的AM中添加VO实例,oracle.apps.pos.supplier.server.S ...
- HDU 4597 Play Game (记忆化搜索博弈DP)
题意 给出2*n个数,分两列放置,每列n个,现在alice和bob两个人依次从任意一列的对头或队尾哪一个数,alice先拿,且两个人都想拿最多,问alice最后能拿到数字总和的最大值是多少. 思路 4 ...
- Java虚拟机结构分析
https://www.cnblogs.com/Eason-S/p/5658188.html https://blog.csdn.net/u013256816/article/details/5148 ...
- ASCII码表(0-127 ) C中的转义字符
所有的ASCII码都可以用“\”加数字(一般是8进制数字)来表示.而C中定义了一些字母前加"\"来表示常见的那些不能显示的ASCII字符,如\0,\t,\n等,就称为转义字符,因为 ...
- 程序中使用7z.exe解压不完整的问题
今天在代码中使用7x.exe解压一个tar压缩包,完成之后,发现关键性的文件不存在, 再细看发现,很多文件都没解压出来. 经研究,发现是这个压缩包中,有2个文件解压位置一样, 7z.exe在中途弹出提 ...
- sgu107. 987654321 problem 简单打表 难度:0
107. 987654321 problem time limit per test: 0.25 sec. memory limit per test: 4096 KB For given numbe ...
- 快速切题 poj2632
Crashing Robots Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 7799 Accepted: 3388 D ...
- docker中进行IDA远程调试提示“TRACEME: Operation not permitted[1] Closing connection from 192.168.109.1...”的解决方法
加入 --security-opt seccomp:unconfined选项,关闭docker远程命令执行保护 如: docker run --security-opt seccomp:unconfi ...