首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使用Jquery.dotdotdot的间歇截断

使用Jquery.dotdotdot的间歇截断
EN

Stack Overflow用户
提问于 2016-03-28 15:56:55
回答 1查看 682关注 0票数 0

我正在使用jquery.dotdotdot截断Carousel上的磁贴上的冗长文本。截断有时会间歇性地截断,而不是预期的结果。(例如,将文本截断为4行,但在某些情况下仅截断为3行。)

在我的CSS中,我曾经有4行的公式是Max-height = line-height *4。

感谢您的回复。谢谢。JS:

代码语言:javascript
复制
$(document).ready(function () { 
                EllipsisConfigFunction($(".module-body.dot-ellipsis"));

    function EllipsisConfigFunction($elements) {
        $elements.each(function () {
            var $element = $(this);
            $element.dotdotdot({
                // configuration goes here
                ellipsis: '... ',

                /*  How to cut off the text/html: 'word'/'letter'/'children' */
                wrap: 'word',

                /*  Wrap-option fallback to 'letter' for long words */
                fallbackToLetter: true,

                /*  jQuery-selector for the element to keep and put after the ellipsis. */
                after: null,

                /*  Whether to update the ellipsis: true/'window' */
                watch: true,

                /*  Optionally set a max-height, can be a number or function.
                    If null, the height will be measured. */
                height: null,

                /*  Deviation for the height-option. */
                tolerance: 0,

                /*  Callback function that is fired after the ellipsis is added,
                    receives two parameters: isTruncated(boolean), orgContent(string). */
                callback: function (isTruncated, orgContent) { },

                lastCharacter: {

                    /*  Remove these characters from the end of the truncated text. */
                    remove: [' ', ',', ';', '.', '!', '?'],

                    /*  Don't add an ellipsis if this array contains
                        the last character of the truncated text. */
                    noEllipsis: []
                }
            });
        });
    }
    });

CSS:

代码语言:javascript
复制
.module-body{
            max-height: 80px;
            overflow: hidden;
            position: relative;
            text-align: left;
            line-height:20px;
        }
EN

回答 1

Stack Overflow用户

发布于 2016-03-28 16:53:49

由于您尚未发布任何代码,因此我最好的建议如下:

代码语言:javascript
复制
https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/
https://api.jquery.com/jQuery.trim/
http://stackoverflow.com/a/4637957/5833940

看看这些是否能解决你的问题。

最高记录:)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/36258246

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档