Форум Сайтостроение Веб-строительство

Скрипт js сворачивающий текст начиная с 15го слова

P
На сайте с 06.01.2009
Offline
592
postavkin
747

Добрый день. Только если задача покажется легкой (я так подумал, что для гуру программирования не составит сложностей) и у вас есть время просто мне помочь. ))

Нужен скриптик на js сворачивающий текст начиная с 15го слова.

Формат текста такой, желательно в текст не вставлять никакие разделители. Т.е. не хотелось бы менять формат текста.

<p>текст текст текст........+- 300 слов</p>

<p>текст текст текст........+- 300 слов</p>

нужно получить

текст 15 слов читать далее...

Если много прошу, все пойму. Согласен.

Samail
На сайте с 10.05.2007
Offline
361
Samail
#1

https://www.jqueryscript.net/tags.php?/read%20more/ выбирайте.

P
На сайте с 06.01.2009
Offline
592
postavkin
#2

Есть одна незадача. Исходник норм работает и в разных браузерах и с разных устройств.

Поставил такую "свертку" на сайт, но почему то именно в Chrome и только с телефона не хочет сворачивать.

Не понимаю, куда копать...

Samail
На сайте с 10.05.2007
Offline
361
Samail
#3

Не видя кода никто не скажет.

D.iK.iJ
На сайте с 26.05.2013
Offline
225
D.iK.iJ
#4

Не знаю - что там именно нужно... в примере скрипт вон вообще просто 50px оставляет и все. И никакие слова не считает.

Поэтому набросал простой пример для любого P на странице.

<p>Бла бла Бла бла Бла бла Бла бла Бла бла.</p>

<style>
p {overflow: hidden; height: 50px; position: relative;}
p:after {content: ''; cursor: pointer; position: absolute; background: rgba(255, 255, 255, 0.5); background: -webkit-linear-gradient(top, transparent 0%,#fff 100%); width: 100%; left: 0px; bottom: 0px; height: 15px; linear-gradient(top, transparent 0%,#fff 100%); width: 100%; left: 0px; bottom: 0px; height: 15px;}

p.open {height: auto;}
p.open:after {display: none;}
</style>

<script>
$("p").click(function () {
$(this).toggleClass("open");
});
</script>

Можно попробовать на странице http://dikij.com/test3.php

Да, можно было бы анимацию добавить и все такое... но что-то немного лень делать это в час ночи :)

---------- Добавлено 23.05.2018 в 01:57 ----------

А, ну да. В плагине еще тень вот так сделана:

background: linear-gradient(to right, rgba(250, 250, 250, 0), rgba(250, 250, 250, 1) 65%);
Адаптивный дизайн в 2 строчки ( https://dikij.com/wm/adaptaciya-saytov.php ). + Принимаю заказы любой сложности ( https://searchengines.guru/ru/forum/926323 ). 💎 Еще я делаю классные кулоны с опалами ( https://mosaicopal.ru/ ).
Samail
На сайте с 10.05.2007
Offline
361
Samail
#5

Вот этот скрипт считает, правда не слова, а символы: https://www.jqueryscript.net/demo/Read-More-Less-Plugin-jQuery-Shorten/

nezabor
На сайте с 19.07.2010
Offline
152
nezabor
#6

DiKiJ, есть такая загогулина что click в мобильной версии не работает

добавь в css cursor: pointer; и все заработает

Чудес не бывает...
PL
На сайте с 09.03.2017
Offline
12
PierreLock
#7
Samail:
Вот этот скрипт считает, правда не слова, а символы: https://www.jqueryscript.net/demo/Read-More-Less-Plugin-jQuery-Shorten/

код не смотрел, но теоретически можно отсчитать 14 пробелов

KV
На сайте с 22.12.2011
Offline
88
K_V_S
#8

postavkin, а вы в какой сфере спец.? А то у меня недавно угнали трафф с мобильного, накачали хрен знает через что хрен знает что, и за сутки весь месячный лимит off. Баш на баш, я вам сделаю js для вашего запроса, а вы, если спец по траффу, подскажете, как с мобилки убрать эту непонятночто. :) Пишите в ЛС.

Как бы на тебя ни давили, никогда не соглашайся на роль, что тебе не нравится *** http://handmade.tigress.com.ua

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий