25.01.2018, 19:37
|
|
Профессор
|
|
Регистрация: 19.02.2015
Сообщений: 219
|
|
Как правильно скрыть часть текста?
Здравствуйте. Помогите, пожалуйста, поправить ошибки в скрипте, который скрывает часть длинного текста. А именно, если в тексте есть параграфы, то он их игнорирует или скрывает после первого, или еще любым другим способом как ему угодно. Если текст идет сплошной, без параграфов, то скрипт работает правильно. И еще один момент, как научить скрипт, чтобы он скрывал текст после точки, а не в средине предложения? Спасибо!
<script>
(function($) {
$.fn.truncate = function(options) {
var defaults = {
length: 100,
minTrail: 10,
moreText: "",
lessText: "",
ellipsisText: ""
};
var options = $.extend(defaults, options);
return this.each(function() {
obj = $(this);
var body = obj.html();
if (body.length > options.length + options.minTrail) {
var splitLocation = body.indexOf(' ', options.length);
if (splitLocation != -1) {
var splitLocation = body.indexOf(' ', options.length);
var str1 = body.substring(0, splitLocation);
var str2 = body.substring(splitLocation, body.length - 1);
obj.html(str1 + '<span class="truncate_ellipsis">' + options.ellipsisText +
'</span>' + '<span class="truncate_more">' + str2 + '</span>');
obj.find('.truncate_more').css("display", "none");
obj.append(
'<div class="clearboth">' +
'<a href="#" class="truncate_more_link">' + options.moreText + '</a>' +
'</div>'
);
var moreLink = $('.truncate_more_link', obj);
var moreContent = $('.truncate_more', obj);
var ellipsis = $('.truncate_ellipsis', obj);
moreLink.click(function() {
if (moreLink.text() == options.moreText) {
moreContent.show('normal');
moreLink.text(options.lessText);
ellipsis.css("display", "none");
} else {
moreContent.hide('normal');
moreLink.text(options.moreText);
ellipsis.css("display", "inline");
}
return false;
});
}
}
});
};
})(jQuery);
$().ready(function() {
$('.story').truncate({
length: 20,
minTrail: 10,
moreText: 'Подробнее',
lessText: 'Скрыть',
ellipsisText: "[...]"
});
});
</script>
<style>
.story {
margin: 0 0 20px 0;
}
</style>
<div class="story">В этом блоке нет параграфов. Однажды осенью матушка варила в гостиной медовое варенье, а я, облизываясь, смотрел на кипучие пенки. Батюшка у окна читал Придворный календарь, ежегодно им получаемый. Эта книга имела всегда сильное нљ него влияние: никогда не перечитывал он ее без особенного участия, и чтение это производило в нем всегда удивительное волнение желчи. Матушка, знавшая наизусть все его свычаи и обычаи, всегда старалась засунуть несчастную книгу как можно подалее, и таким образом Придворный календарь не попадался ему на глаза иногда по целым месяцам. Зато, когда он случайно его находил, то, бывало, но целым часам не выпускал уж из своих рук. Итак, батюшка читал Придворный календарь, изредка пожимая плечами и повторяя вполголоса: «Генерал-поручик!.. Он у меня в роте был сержантом!.. Обоих российских орденов кавалер!. А давно ли мы...» Наконец батюшка швырнул календарь на диван и погрузился в задумчивость, не предвещавшую ничего доброго.</div>
<div class="story"><p>В этом блоке есть параграфы.</p><p>Однажды осенью матушка варила в гостиной медовое варенье, а я, облизываясь, смотрел на кипучие пенки. Батюшка у окна читал Придворный календарь, ежегодно им получаемый.</p><p>Эта книга имела всегда сильное нљ него влияние: никогда не перечитывал он ее без особенного участия, и чтение это производило в нем всегда удивительное волнение желчи.</p><p>Матушка, знавшая наизусть все его свычаи и обычаи, всегда старалась засунуть несчастную книгу как можно подалее, и таким образом Придворный календарь не попадался ему на глаза иногда по целым месяцам. Зато, когда он случайно его находил, то, бывало, но целым часам не выпускал уж из своих рук.</p><p>Итак, батюшка читал Придворный календарь, изредка пожимая плечами и повторяя вполголоса: «Генерал-поручик!.. Он у меня в роте был сержантом!.. Обоих российских орденов кавалер!. А давно ли мы...» Наконец батюшка швырнул календарь на диван и погрузился в задумчивость, не предвещавшую ничего доброго.</p></div>
Последний раз редактировалось LADYX, 25.01.2018 в 22:57.
|
|
25.01.2018, 19:53
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
LADYX,
ошибок в плагине нет, но он расчитан на работу с текстом, как и большинство таких плагинов, в них нет учёта тегов.
|
|
25.01.2018, 22:31
|
|
Профессор
|
|
Регистрация: 19.02.2015
Сообщений: 219
|
|
рони,
приветствую вас! Я хотел добавить свой вопрос таким способом, чтобы можно было просмотреть его в действии, но я так и не понял как это сделать. Я не совсем понял, что имеется ввиду под тем, что нет учёта тегов, т.е. независимо от того, есть ли параграфы или нет, скрипт должен одинаковый объем текста показывать, а остальное скрывать? Вы пожалуйста посмотрите, в блоке где есть параграфы, текст скрывается уже сразу после первого параграфа.
|
|
25.01.2018, 22:36
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
LADYX,
[HTML run]код всей страницы[/HTML]
О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
|
|
25.01.2018, 22:39
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
LADYX,
по плагину, не умеют плагины делать то что вам нужно, за очень редким исключением.
|
|
25.01.2018, 23:00
|
|
Профессор
|
|
Регистрация: 19.02.2015
Сообщений: 219
|
|
рони,
скажите, пожалуйста, а что можете посоветовать в этом случае?
|
|
25.01.2018, 23:07
|
|
Профессор
|
|
Регистрация: 01.12.2016
Сообщений: 3,650
|
|
Можно свой написать, который будет просто блок сжимать по размеру (это самый простой вариант)
|
|
25.01.2018, 23:17
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,108
|
|
|
|
25.01.2018, 23:26
|
|
Профессор
|
|
Регистрация: 01.12.2016
Сообщений: 3,650
|
|
рони,
неплохо было бы
func(".блок1", 150высота);
func(".блок2", 300);
|
|
26.01.2018, 00:28
|
|
Профессор
|
|
Регистрация: 19.02.2015
Сообщений: 219
|
|
Да, я знаю, конечно это самый простой вариант. Но в блоках могут быть как картинки, так и таблицы, или дополнительные заголовки или подзаголовки. Поэтому этот вариант, как просто размерность, к сожалению однозначно не подойдет.
|
|
|
|