Как реализовать скрытие/отображение длинного текста внутри блока div?

  • 10 сентября 2023 г. 6:26
Ответы на вопрос 2
Вот исправленный JavaScript код:

```javascript
showAd();
function showAd() {
    var obj = document.getElementById("123");
    var paragraph = obj.getElementsByTagName("p")[0];
    if (obj.style.height === "140px") {
        obj.style.height = "auto";
        paragraph.style.height = "auto";
    } else {
        obj.style.height = "140px";
        paragraph.style.height = "140px";
    }
}
```

Теперь при клике на блок он будет расширяться на полную высоту и показывать весь текст, а также снова сворачиваться при повторном клике.
Найденное решение для ограничения текста в элементе div и возможности разворачивания блока по клику выглядит следующим образом:

HTML:

Тут какой-то текст длиной до 2000 символов, но нужно показывать только первые 200 символов. По событию onClick блок должен развернуться. А если блок уже развернут - свернуться.

CSS: .truncate-text{ height: 130px; overflow: hidden; position: relative; } .truncate-text.opener { height: auto; } .truncate-text:after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 40px; background: linear-gradient(180deg, transparent, white 50%); } .truncate-text.opener:after { opacity: 0; } Javascript (jQuery):
Похожие вопросы