<style>
/*Высота свёрнутого текста*/
:root { --main-height: 150px}
.short_version {height: var(--main-height) !important}
.t527__perstext , .t527__perstext:after, .t527__textbtn div:after ,
.t527__textbtn { transition: all 0.3s}
.t527__perstext {
height: var(--main-height);
overflow: hidden;
display: flex;
position: relative;
}
.t527__perstext div{height: max-content}
.short_version.t527__perstext:after { bottom: 0px}
.t527__perstext:after {
content: "";
position: absolute;
width: 100%;
height: 50px;
bottom: -50px;
left: 0;
background-image: linear-gradient(180deg, rgba(29,29,29,0) 0%, rgba(29,29,29,1) 100%);
}
.t527__textbtn {
color: #fff;
font-size: 15px;
font-weight: 400;
margin-top: 15px;
cursor: pointer;
}
.t527__textbtn:hover { opacity: 0.6}
.t527__textbtn div:after {
content: "\2193";
margin-left: 5px;
}
.short_mode .t527__textbtn div:after { content: "\2191"}
.t527__bgimg {
background-size: contain;
background-position-x: left;
}
</style>
<script>
$( document ).ready(function() {
$('.t527__itemwrapper').append('<div class="t527__textbtn t-text"><div>Подробнее</div></div>');
$('.t527__perstext').addClass('short_version');
$('.t527__perstext').wrapInner('<div></div>');
function setSize(){
$('.t527__perstext').each(function(){
$(this).css('height' , $(this).children('div').height() );
});
};
setSize();
$('.t527__textbtn div').click(function() {
$(this).closest('.t527__itemwrapper').toggleClass('short_mode');
let text = $(this).text();$(this).text(text == "Подробнее" ? "Скрыть" : "Подробнее");
$(this).closest('.t527__itemwrapper').find('.t527__perstext').toggleClass('short_version');
});
$(window).resize(function() {clearTimeout(window.resizedFinished); window.resizedFinished = setTimeout(function(){ setSize() }, 1000);});
});
</script>