Card com botão “Ver Mais”
Código JavaScript <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script type="text/javascript"> var $ = jQuery; $(document).ready(function(){ $(‘.show-more’).on(‘click’, function(){ event.preventDefault() $(this).toggleClass(‘content-hide’) $(this).closest(‘.profile-card’).find(‘.show-less, .details-area’).toggleClass(‘content-hide’) }) $(‘.show-less’).on(‘click’, function(){ event.preventDefault() $(this).toggleClass(‘content-hide’) $(this).closest(‘.profile-card’).find(‘.show-more, .details-area’).toggleClass(‘content-hide’) }) }) </script> <style> .content-hide{ display: none; } </style>
Slider Interativo com Carrossel de Cards
CSS do Testimonial Carousel selector{ –radius: 8px; –height: 320px; –active-height: 410px; –overlay: 0.75; } selector{ opacity: 0; transform: translateX(100px); transition: all 0.8s ease-in-out; } selector.loaded{ opacity: 1; transform: translateX(0); } selector .swiper-wrapper{ height: var(–active-height); align-items: center; } selector:not(.loaded) .swiper-wrapper{ transition-duration: 0s !important; } selector .swiper-slide{ display: flex; align-items: flex-end; border-radius: var(–radius); height: var(–height); box-shadow: 0 […]