Имеется блок div
, который имеет заголовок. При клике блок увеличивается в размере и в этот момент должен появится контент. Как это можно сделать? После повторного клика, блок возвращается в исходный размер. Код прилагается:
$('.card-warning').on('click', function(e) {
e.preventDefault();
//при втором клике
if ($('.card-warning').hasClass('w')) {
$('.card-warning').animate({
width: 355,
height: 100
});
$('.card-warning').removeClass('w');
} else {
//при первом клике
$('.card-warning').addClass('w');
$('.card-warning').animate({
width: 360,
height: 400
});
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="card text-white card-warning">
<div class="card-body">
<blockquote class="card-bodyquote">
<h5>Медиа / СМИ</h5>
</blockquote>
</div>
</div>