// Hướng dẫn tạo hiệu ứng "Xem thêm / Thu gọn" cho phần mô tả sản phẩm
function webdy_readmore_flatsome(){
?>
<style>
.single-product div#tab-description {
overflow: hidden;
position: relative;
padding-bottom: 25px;
}
.fix_height{
max-height: 800px;
overflow: hidden;
position: relative;
}
.single-product .tab-panels div#tab-description.panel:not(.active) {
height: 0 !important;
}
.webdy_readmore_flatsome {
text-align: center;
cursor: pointer;
position: absolute;
z-index: 10;
bottom: 0;
width: 100%;
background: #fff;
}
.webdy_readmore_flatsome:before {
height: 55px;
margin-top: -45px;
content: "";
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff00', endColorstr='#ffffff',GradientType=0 );
display: block;
}
.webdy_readmore_flatsome a {
color: #318A00;
display: block;
}
.webdy_readmore_flatsome a:after {
content: '';
width: 0;
right: 0;
border-top: 6px solid #318A00;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
display: inline-block;
vertical-align: middle;
margin: -2px 0 0 5px;
} border-left: 6px solid transparent;
border-right: 6px solid transparent;
.webdy_readmore_flatsome_less a:after {
border-top: 0;
border-bottom: 6px solid #318A00;
}
.webdy_readmore_flatsome_less:before {
display: none;
}
</style>
<script>
(function($){
$(document).ready(function(){
$(window).on('load', function(){
if($('.single-product div#tab-description').length > 0){
let wrap = $('.single-product div#tab-description');
let current_height = wrap.height();
let your_height = 2500;
if(current_height > your_height){
wrap.addClass('fix_height');
wrap.append(function(){
return '<div class="webdy_readmore_flatsome webdy_readmore_flatsome_more"><a title="Xem thêm" href="javascript:void(0);">Xem thêm</a></div>';
});
wrap.append(function(){
return '<div class="webdy_readmore_flatsome webdy_readmore_flatsome_less" style="display: none;"><a title="Xem thêm" href="javascript:void(0);">Thu gọn</a></div>';
});
$('body').on('click','.webdy_readmore_flatsome_more', function(){
wrap.removeClass('fix_height');
$('body .webdy_readmore_flatsome_more').hide();
$('body .webdy_readmore_flatsome_less').show();
});
$('body').on('click','.webdy_readmore_flatsome_less', function(){
wrap.addClass('fix_height');
$('body .webdy_readmore_flatsome_less').hide();
$('body .webdy_readmore_flatsome_more').show();
});
}
}
});
});
})(jQuery);
</script>
<?php
}
