Ребята! Очень надеюсь на Вашу помощь!
Имеется большой кусок текста с html-тегами. Как сделать так, чтоб была видна только его верхняя часть (в пределах 80px), а остальная часть появлялась при нажатии на кнопку "Читать далее..." (без перезагрузки страницы).
Находил несколько решений, но к сожалению не одно из них не подошло, т.к. во всех этих решениях предполагается наличие двух частей - то что должно быть отображено и то, что должно быть скрыто.
Самый подходящий вариант который был найден выглядет следующим образом:
<html>
<body>
Тут текст<BR>
<div style="height:'100%'">
<div id="ta" style="height:80px;overflow:hidden">
bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>
</div>
<span style="cursor:pointer;color:blue" onclick="document.getElementById('ta').style.height = '100%'">Читать далее...</span>
</div>
Еще какой-то текст....
</body>
</html>
Можно ли в этом примере сделать чтобы "Читать далее" Не отображалась если текст помещается в 80px, а также если он уже был раскрыт?
И самое главное как сделать автоуменьшение блока, если текст занимает меньше чем 80px?
Возможно это уже здесь где-то обсуждалось, но я к сожалению не смог найти...