- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 jquery.dotdotdot 为文本部分创建“阅读更多/阅读更少”链接。对于有多个 p 标签的部分,不会显示文本。不太确定问题是什么。我已将我的代码包含在下面的 fiddle 中。
非常感谢任何帮助!谢谢!
$(function () {
var addLink = $('.securetext');
addLink.append('<span class="readmore trigger-js"> <a >Read more</a></span>');
for (i = 0; i < addLink.length; i++) {
if ($(addLink[i]).children("p").length > 0) {
$(addLink[i]).children("p").last().append('<span class="readless trigger-js"> <a >Read less</a></span>');
} else {
$(addLink[i]).append('<span class="readless trigger-js"> <a >Read less</a></span>');
}
}
truncateIfNeeded(); // Initialize ellipsis
});
var truncateIfNeeded = function (jqueryTag) {
var $selectionToTruncate = jqueryTag || $('.securetext');
$selectionToTruncate.dotdotdot({
ellipsis: '... ',
watch: true,
//wrap : 'letter',
height: 20 * 3, // max number of lines
after: '.readmore',
callback: function (isTruncated, orgContent) {
var $currentReadMore = $(this).find('.readmore');
var $currentReadLess = $(this).find('.readless');
if (isTruncated) {
$(this).addClass('securetext--is-truncated');
$(this).removeClass('securetext--is-not-truncated');
}
bindReadMore(); // bind click on "read more"
}
});
};
最佳答案
问题在于用于截断的算法。
在第一次迭代中,阅读更多...
链接添加在该段落之后(恰好有 3 行长)。这意味着调用了截断逻辑。
在第二次迭代中,阅读更多...
添加到段落内。然后整个内容会变成 3 行,因此它被删除。这显然是一个错误。
GitHub 上描述错误的问题 was closed as wontfix .
This pull request提供了部分修复,但如果元素在段落之间被截断,则不会显示省略号。 (不过,阅读更多链接将会显示。)
关于jquery.dotdotdot 部分未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29507445/
我使用 dotdotdot 截断高度指定框中的文本 Gloves Some gloves text.
我正在使用 jquery.dotdotdot 为文本部分创建“阅读更多/阅读更少”链接。对于有多个 p 标签的部分,不会显示文本。不太确定问题是什么。我已将我的代码包含在下面的 fiddle 中。 非
我一直在尝试使用 jquery 的 dotdotdot 方法来切断溢出的文本,但由于某种原因它不起作用。我希望该方法非常简单,但我不知道我做错了什么。 Javascript: $(document).
如何在 jquery dotdotdot 插件中通过 css 设置自动高度。 注意:我使用 dotdotdot插件。 例如: .dot{ overflow: hidden; width: 150px;
这里是一个由多个部分组成的问题,但我将从主要问题开始。 我在让 jQuery 插件在我正在设计的网站上运行时遇到问题。 FireBug 告诉我“TypeError: $(...).dotdotdot
我对 Javascript 和 jQuery 知之甚少,我正在尝试使用 jQuery 和 dotdotdot用于截断表中的 TD 第二个换行行之后的插件。 我想如果不问我就永远学不会; A.这可能吗?
我正在使用 jQuery、Modernizr 和一些插件(jQuery.dotdotdot、MixItUp)设计一个网站。作为基础,我选择了 this work from codyhouse 。因此,
我正在使用 Jquery 插件 dotdotdot.. ( http://dotdotdot.frebsite.nl/ )。我遇到了一些问题。 当我将它应用于我的日文长文本时,它无法正常工作并且显示空
我是 angularJS 的新手,可能写了一些不好的东西...... 但是我怎样才能正确实现这个插件:https://github.com/BeSite/jQuery.dotdotdot 在我的 ta
将 calc 应用于包含 div 的宽度会使 jQuery dotdotdot 插件停止工作。 html { font-size: 62.5%; } div#outer { width
我在 AngularJS 中使用 dotdotdot JQuery 插件时遇到了一个小问题。这是我的 HTML 代码: {{v
我正在尝试使用 dotdotdot 插件在面板中显示评论列表,但结果并不令人高兴: 来自下面的 xhtml 代码: #{Comment
为了在元素内的第二行之后创建一个省略号,我使用了 jquery dotdotdot .我将它与 google font 'source sans pro' 一起使用,但是在调整窗口大小之前它无法正常工
当我的网站上的多个多行段落超过特定高度时,我试图将省略号附加到它们。为此,我正在使用 dotdotdot , jquery 插件。 奇怪的是,当我刷新页面时它不起作用。它仅在我调整窗口大小后才起作用(
我想使用 dotdotdot jQuery 库在 Flexslider 幻灯片中的幻灯片标题中添加省略号: $(window).load(function() { $('.flexslider')
我有这个 fiddle : http://jsfiddle.net/6HKJZ/3/ 这是CSS中引起麻烦的部分: .r .rp{ max-width:50%; } .r .r2{ paddi
我想在我的函数中调用 glm,一个最小的例子是: my.glm |z|) (Intercept) 0.07628 0.07433 1.026 0.305 (Dispersion pa
以下 fiddle 演示了该问题: http://jsfiddle.net/inconduit/2z6Xa/ 这是使用 jquery.dotdotdot 插件用省略号截断文本。 当像 a_really
我正在尝试让文本 block 垂直调整大小并使用 dotdotdot jQuery ellipsis-support 插件。 dotdotdot 插件具有设置高度参数,我想知道是否有动态更新该设置高度
我正在尝试使用 dotdotdot jQuery 插件。在大多数情况下它工作正常。但是在下拉菜单中,它并没有像我预期的那样工作。我发现这是因为我的下拉列表 display:hidden; 阻止了插件正
我是一名优秀的程序员,十分优秀!